刷新图像jquery

时间:2012-09-11 14:14:54

标签: c# jquery ajax

我在ASp.Net应用程序中上传了带有ajax表单的图像。我需要刷新图像,所以我试试这个:

$(function () {
   $(".fileUploadForm").ajaxForm({
      success: function (data, text, xhr, form) {
       var tmp = jQuery(this).closest("img[class=imageResource]").attr('src');
      }
   });
});

这是我的形象:

 <img class="imageResource" alt="picture" src="@Url.Action("Picture", new { id = Model.Id })" />

如何查找和重写具有相同名称的图像源

更新

这是我的HTML:

<div class="thumbnail">
<a target="_blank" href="/Template/OriginalPicture/8b8c824b-9605-4931-9fe2-1f5979baca42">
<img class="imageResource" src="/Template/Picture/8b8c824b-9605-4931-9fe2-1f5979baca42" alt="picture">
</a>
<div class="caption">
<div style="margin-bottom: 5px;">
<form class="form-horizontal fileUploadForm" method="post" enctype="multipart/form-data" action="/Template/PictureResource?resourceId=8b8c824b-9605-4931-9fe2-1f5979baca42&configId=aa383b5a-23b2-4780-965e-ef4e95cd3fa2&pageNumber=1">
<div class="input-append">
<input type="file" name="picture">
<input class="span1" type="text" size="128" style="width: 86px;">
<button class="btn browse" type="button"> ...</button>
<button class="btn" type="submit">Upload</button>
</div>
</form>
</div>
</div>

1 个答案:

答案 0 :(得分:1)

试试这段代码:

$(function () {
   $(".fileUploadForm").ajaxForm({
      success: function (data, text, xhr, form) {
       var tmp = form.closest('.thumbnail').find('.imageResource').attr('src');
        form.closest('.thumbnail').find('.imageResource').attr('src', tmp + "?" + (new Date()).getTime());
      }
   });
});

我不确定jQuery(this)是否会返回一个表单(不记得那里有“this”) (new Date()).getTime() - 只是更改图片网址并强制浏览器不从缓存中获取图片。呃。并没有注意到.closest - 它将搜索最近的父元素,而不是子元素。您可以使用.find

form - 根据文档closest('.thumbnail'),这是一个当前来源,将找到最接近表单的类.thumbnail。 .find('.imageResource')只会在imageResource内搜索包含.thumbnail类的元素。由于缩略图中只有一个带有imageResource类的图像标记 - 上面的代码应该可以正常工作