Question

我正在研究2000年初设计的非常古老的应用程序。该页面完全适用于IE9但不适用于Firefox。经过大量挖掘后，我遇到了一个问题。我在这个简单的例子中重现了这一点。

function bindEvent(el, eventName, eventHandler) {
  if (el.addEventListener) {
    el.addEventListener(eventName, eventHandler, false);
  } else if (el.attachEvent) {
    el.attachEvent('on' + eventName, eventHandler);
  }
}

function fun() {
  var ele = document.getElementById("tt");
  bindEvent(ele, "click", one);
  bindEvent(ele, "click", two);
  bindEvent(ele, "click", three);

}

function one() {
  alert("1");
}

function two() {
  alert("2");
}

function three() {
  alert("3");
}

<button onclick="fun()">Bind</button>
<button id="tt" name="tt">Test</button>

我已将非IE浏览器不支持的自定义bindevent函数编写为attachevent。

单击“绑定”按钮将三个事件绑定到“测试”按钮。现在点击Test按钮输出

IE：

3 2 1

火狐

1 2 3

所以我可以在两种浏览器中确保执行顺序相同

Answer 1

这是IE8事件模型的一个怪癖。 MSDN对attachEvent：

发表了评论

如果将多个函数附加到同一对象上的同一事件，则在调用对象的事件处理程序之后立即以随机顺序调用这些函数。

我认为你可以通过只注册一个事件处理程序而不是三个来克服它。

function fun() {
  var ele = document.getElementById("tt");
  bindEvent(ele, "click", function() {
    one();
    two();
    three();
  });
}

将多个事件附加到IE中的按钮问题

1 个答案: