刚刚上传的显示图片

我让用户上传图片，效果很好。如果用户第一次加载页面，该图像也会显示在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

刚刚上传的显示图片

回答

相关问题