javascript - 在 Internet Explorer 中侦听更改事件

Question

addEventListener对于 IE 9 和 10 中的输入文件选择应在文件选择后触发，但在第二次选择文件后触发，这意味着如果第一次没有选择文件，则第一次选择不会触发，之后每个文件都不会触发选择侦听器事件触发（如果选择了不同的文件）。我的代码片段：

HTML

<input type="file" name="imagefile" id="upload">

JavaScript

var file = document.getElementById("upload");
file.addEventListener("change", handlefileselect, false);

function handlefileselect(event) {
    alert("file selected");
}

该代码在 Firefox 和 Chrome 中运行良好，但在 IE 中存在问题。

Answer 1

旧的 IE 版本不支持.addEventListener ()方法，它有一个.attachEvent()方法而不是向元素添加事件。

使用以下addEvent 方法

function addEvent(evnt, elem, func) {
   if (elem.addEventListener)  // W3C DOM
      elem.addEventListener(evnt,func,false);
   else if (elem.attachEvent) { // IE DOM
      elem.attachEvent("on"+evnt, func);
   }
   else { // No much to do
      elem[evnt] = func;
   }
}

var file = document.getElementById("upload");
addEvent('change', file, handlefileselect)

Answer 2

您应该为 IE 使用 attachEvent 函数。

file.addEventListener ? file.addEventListener("change", handlefileselect, false) : file.attachEvent("onchange", handlefileselect);

Answer 3

尝试使用它，我没有检查，但大多数 IE 问题都已通过标题部分中的此标记解决

<meta http-equiv="X-UA-Compatible" content="IE=edge">