Jason_liu

导航

<input type="file">设置的onchange只能执行一次的解决方案

最近有需要要做一个晒图的功能,和淘宝晒图差不多,最多可以选择5个图片,要用ajax方式的。考虑了一下,如果用swfupload(flash)上传,要弄验证的问题,超级麻烦;于是准备用ajaxFileUpload的jQuery插件。


于是问题就来了,file的onchange事件只能在刷新页面后,执行一次,第二次就不执行了。网上很少有对ajaxFileUpload绑定file进行ajax上传第二次失效的问题进行解释,后来找到说不能用$('id').bind('change',function(){}) 来执行,但可以用live取代bind。取得不错的效果。
在网上也有人遇到这样的情况,记下来:

今天在用ajaxfileupload时,遇到一个要刷新一次页面才能再次上传,用live()方法来绑定<input type="file">的change事件就能够解决?直接$("xxx").change();只能调用一次,据闻是IE浏览器的安全性。后来终于找到解决方案了。IE浏览器下<input type="file">选择完成自动提交的问题,在每次处理完成后把<input type="file" />替换成原来的代码,然后随便加个不同的属性。如本例中添加了title。

var count = -1;
    $("#upload").live("change", function () {
        count++;
    $.ajaxFileUpload(config);
    $("#upload").replaceWith("<input type='file' id='upload' name='upload' style='position:relative; top:0px; left:-240px; width:346px; height:46px; opacity:0; filter: Alpha(Opacity=0); cursor:pointer; title=" + count + "' />");
})

posted on 2013-06-13 00:14  Jason_liu  阅读(18545)  评论(0编辑  收藏  举报