使用带有.change（）事件的输入类型=“文件”字段上传文件并不总是在IE和Chrome中触发
我有一段简单的代码来上传文件：
$(document).ready(function () { $(".attachmentsUpload input.file").change(function () { $('form').submit(); }); }); 当我点击输入然后在对话框中选择一个文件时，我正在使用ajax提交此文件。 这不是重要的部分。 重要的是，当我在对话框中第二次选择相同的文件时，在提交第一个文件之后，.change（）事件不会在IE和Chrome中触发。 但是当我选择不同的文件时，事件会触发并正常工作。 在Firefox下，它一直在开火。
如何解决这个问题，按预期工作（如在Firefox中）？
描述
发生这种情况是因为如果再次选择同一文件，则输入字段（所选文件路径）的值不会更改。
您可以将onChange()事件中的值设置为空字符串，并仅在值不为空时提交表单。 看看我的样本和这个jsFiddle演示 。
样品
$(".attachmentsUpload input.file").change(function () { if ($(".attachmentsUpload input.file").val() == "") { return; } // your ajax submit $(".attachmentsUpload input.file").val(""); });
更新
出于任何原因，这在IE9中不起作用。 您可以替换元素以重置它们。 在这种情况下，您需要jQuery live()来绑定事件，因为您的输入字段将被动态（重新）创建。 这适用于所有浏览器。
我在stackoverflow上找到了这个解决方案， 使用jQuery清除输入类型=’文件’
$(".attachmentsUpload input.file").live("change", function () { if ($(".attachmentsUpload input.file").val() == "") { return; } // get the inputs value var fileInputContent = $(".attachmentsUpload input.file").val(); // your ajax submit alert("submit value of the file input field=" + fileInputContent); // reset the field $(".attachmentsUpload input.file").replaceWith(''); });
更多信息
- jQuery.live（）
- jQuery.replaceWith（）
看看我更新的jsFiddle
注意： live现在已从更高版本的jQuery中删除 。 请使用而不是live 。
基于dknaack答案，线索是使用jquery live绑定更改事件并在提交后重置输入字段 ：
$(document).ready(function () { $(".attachmentsUpload input.file").change(function () { $('form').submit(); /* sync submit */ $(".attachmentsUpload input.file").replaceWith(''); }); });
必须在提交事件完成后执行重置。 当提交为异步时 ，重置字段，例如在ajax success事件中。
$(document).ready(function () { $(".attachmentsUpload input.file").change(function () { $('form').submit(); /* async submit */ }); }); .ajaxForm({ ... success: function (result) { // reset the field - needed for IE to upload the same file second time $this.find("input.file").replaceWith(''); } });