剛剛上傳的顯示圖片

我讓用戶上傳圖片，效果很好。如果用戶第一次加載頁面，該圖像也會顯示在Web表單上。剛剛上傳的顯示圖片

問題是當用戶上傳另一個圖像（替換圖像）我想新的圖像顯示在頁面上（使用ajax），但沒有顯示任何內容。

網頁表單：

<asp:TextBox ID="txtVllID" runat="server" /><br /> 
<asp:Image ID="imgUploaded" runat="server" /><br />

服務器端腳本：

Public Sub Page_Load(ByVal sender As Object, ByVal args As EventArgs) 

    If Page.IsPostBack Then 
     Exit Sub 
    End If 

    'initieren 
    txtVllID.Text = Nothing 
    txtVllID.Text = Request.QueryString("vllid") 
    imgUploaded.ImageUrl = "ImageHandler.ashx?vllid=" & txtVllID.Text 

End Sub

ImageHandler.ashx

<%@ WebHandler Language="VB" Class="ImageHandler" %> 

Imports System 
Imports System.Web 
Imports System.IO 

Public Class ImageHandler : Implements IHttpHandler 

Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest 
    Dim vllid = HttpContext.Current.Request.QueryString("vllid") 
    context.Response.ContentType = "image/jpeg" 
    context.Response.WriteFile("App_Themes/theme_yellow/uploads/" + vllid + ".jpg") 
End Sub 


Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable 
    Get 
     Return False 
    End Get 
End Property 

End Class

jQuery腳本：

<script type="text/javascript"> 
$(document).ready(function() { 
    var settings = { 
     url: "FileUploadHandler.ashx?vllid=" + $("#txtVllID").val(), 
     allowedTypes: "jpg,jpeg,png,gif", 
     onSuccess: function (files, response, xhr) { 
      $.ajax({ 
       url: "ImageHandler.ashx?vllid=" + $("#txtVllID").val(), 
       datatype: "image/jpg", 
       success: function (data) { 
        //console.log(data); you see imagedata?(bytes?) 
        $("#imgUploaded").attr("src", data); 
       } 
      }); 
      $("#divGelukt").show("slow", function() { }); 
     } 
    } 
    $("#UploadArea").uploadFile(settings); 
}); 
</script>

在屏幕上圖像不可見。當我查看瀏覽器中的結果代碼時，imgUploades.src包含不可讀的字符。我怎樣才能讓它成爲一個圖像？

來源

2015-01-12 Leon

只需將img src設置爲圖片url，而不是使用ajax下載。

onSuccess: function (files, response, xhr) { 
     $("#imgUploaded").attr("src", "ImageHandler.ashx?vllid=" + $("#txtVllID").val()); 
     $("#divGelukt").show("slow", function() { }); 
    }

來源

2015-01-12 14:29:51 Musa

剛剛上傳的顯示圖片

回答

相關問題