mvc剃须刀上传新图像后刷新图像

Question

上传了一张新的图片后，我在刷新图片时遇到了问题。通过点击更改按钮，我想上传一个新的图像，旧的应该被刷新。你知道怎么解决这个问题吗？

<img src="@Url.Content(String.Format("~/Logos/{0}.png", ViewData["companyName"]))" alt="Loading..." />
<input class="btn btn-default"  id="changeButton" type="button" value="Logo ändern"/><br/>
<input id="uploadLogo" type="file" name="logoName" style="display: none">

使用jQuery，我通过单击changeButton启动文件上传

    $('#changeButton').click(function () {
    $('#uploadLogo').trigger('click');
});

Answer 1

如果您使用"file“类型的输入，则可以通过两种方式完成此操作。

一个是通过AJAX将图片上传到数据库/项目，并返回图像的url。并将url附加到图像src属性中。

ie9和更高版本支持的另一种方法是，您可以捕获jquery中的上传事件，并从客户端计算机获取url。并将其附加到img属性的src标记中。

请注意，第二个解决方案不会将图片上传/保存到项目/数据库中，但它会为您提供图片的预览。

使用第二种方法保存映像的可能性可以通过对服务器的另一次AJAX调用来实现，但我建议使用它作为预览，并添加一个新的“保存”按钮来保存它。