javascript - Internet Explorer 文件输入 onchange

Question

我有这些动态创建的文件输入 HTML 元素，它们与 jQuery-ajax 文件上传插件一起使用。

我希望在更新输入值后开始文件上传。但是，Internet Explorer 似乎忽略了 Javascript onChange。

如何在 IE 中实现这一点？

例子：

var html = $('<div class="add_input">'+
        '<input type="file" name="file"/></div>').change(submit);

$('#add_inputs').prepend(html);

Answer 1

您可以将上面的内容替换为这些内容

var html = $('<div class="add_input"><input type="file" name="file"/></div>');
$('#add_inputs').prepend(html);
$("div.add_input > input[name='file']").change(submit);

或者

var html = $('<div class="add_input"><input id="filer" type="file" name="file"/></div>');
$('#add_inputs').prepend(html);
$("#filer").change(submit);

Answer 2

当您在 jQuery 中从 HTML 创建元素时，返回的句柄引用最外层的元素，因此您将change事件处理程序放在. <div>，而不是<input>.

这在大多数浏览器中仍然有效，因为在DOM 级别 2 事件规范中，change事件“冒泡”文档以在其更改时通知其父级，因此事件处理程序<div>将获悉其任何 child 的任何更改<input>。然而 IE 有它自己的事件模型，其中变化不会冒泡。

替代：

($('<input type="file" name="file" />')
    .change(submit)
    .prependTo('#add_inputs')
    .wrap('<div class="add_input"></div>')
);