如何使用 JavaScript 和 ASP.NET MVC 更新图像？答案

【问题标题】：How to update image with JavaScript and ASP.NET MVC?如何使用 JavaScript 和 ASP.NET MVC 更新图像？
【发布时间】：2014-08-24 12:45:30
【问题描述】：

我使用Home 控制器的ShowImage() 方法来显示动态生成的图像。

HTML

<img src='@Url.Action("ShowImage", "Home" )' width="267" height="500">

现在我想使用 AJAX 执行一些操作并像这样更新该图像

 $.ajax({
     type: "POST",
     url: '@Url.Action("UpdateUser", "Home")',
     contentType: "application/json; charset=utf-8",
     data: JSON.stringify(params),
     dataType: "json",
     success: function (data) {
         if (data.success.toString() == 'true') {

             // Is it possible update image using JavaScript?


         }
     }
 });

有可能吗？谢谢！

【问题讨论】：

是的，只需更改 src 属性 $("#myimage").attr("src", yourReponse")
ajax调用返回什么？
我假设您的图片链接没有改变，是吗？检查此链接以获取帮助：stackoverflow.com/questions/2104949/…
@EhsanSajjad 实际上我也可以返回图像的字节 []。但我不知道它是否会有所帮助......
还 @ClarkKent 显示从服务器返回的 ajax 调用响应

标签： c# javascript ajax asp.net-mvc image

【解决方案1】：

您的控制器可以使用基本 File 方法返回一个 Image：

public ActionResult Image(string id)
{
     var myStream = new byte[0];
     // your code géneration....
     return File(myStream, "image/jpeg");
}

然后，您更改图像的 src 属性：

$("#image").attr("src", "/MyController/Image/2");

【讨论】：

这是完整的答案，但我已经在您的问题下方评论过一次；）
我很困惑这是如何被接受的答案，因为 OP 正在寻求使用 AJAX 更改图像的帮助。这似乎只显示了如何通过页面加载加载图像，如何使用 AJAX 和 JSON 刷新？

【解决方案2】：

为你的图片添加一个 id：

<img id="anImage" src='@Url.Action("ShowImage", "Home" )' width="267" height="500">

然后在你的成功处理程序中设置如下：

$('#anImage').attr("src", 'success.png');

如果您的图像从控制器以 json 格式返回，请改为从数据中提取：

$('#anImage').attr("src", data.image);

【讨论】：

【解决方案3】：

试试这个纯javascript

document.getElementById("id of ur img").src="your source goes here";

【讨论】：