如何检测inputtypes=文件“更改”为同一个文件?

我想在用户select一个文件时触发一个事件。 这样做与.change事件一起工作,如果用户每次更改文件。

但是,如果用户再次select相同的文件,我想要触发事件。

  1. 用户select文件A.jpg (事件触发)
  2. 用户select文件B.jpg (事件触发)
  3. 用户select文件B.jpg (事件不会启动,我想让它启动)

我该怎么做?

你可以欺骗它。 删除文件元素并将其添加到change事件的相同位置。 它会擦除文件path使其每次都可以改变。

例如jsFiddle。

或者你可以简单地使用.attr("value", "") , 在jsFiddle上看到这个例子 。

如果你已经尝试.attr("value", "") ,并没有工作,不要恐慌(像我一样)

只是做.val("") ,而且会正常工作

我得到这个工作,通过清除文件input值onClick,然后发布onChange文件。 这允许用户连续两次select相同的文件,并且仍然将更改事件触发到服务器。 我的例子使用jQuery表单插件 。

 $('input[type=file]').click(function(){ $(this).attr("value", ""); }) $('input[type=file]').change(function(){ $('#my-form').ajaxSubmit(options); }) 

这为我工作

 <input type="file" onchange="function();this.value=null;return false;"> 

你不能在这里change火力(正确的行为,因为没有改变)。 但是,你也可以绑定click …虽然这可能会频繁…两个之间没有太多的中间地带,虽然。

 $("#fileID").bind("click change", function() { //do stuff }); 

如果你不想使用jQuery

 <form enctype='multipart/form-data'> <input onchange="alert(this.value); return false;" type='file'> <br> <input type='submit' value='Upload'> </form> 

它在Firefox中工作正常,但对于Chrome,您需要添加this.value=null; 警惕之后。

您可以使用form.reset()来清除文件input的files列表。 这会将所有字段重置为默认值,但在很多情况下,您可能只是在表单中使用inputtype ='file'来上传文件。 在这个解决scheme中,不需要再次克隆元素并重新挂钩事件。

感谢philiplehmann

那么,我有同样的问题。 我使用“input”(或input)事件,而不是改变,它的工作就像魅力。