Question

我有：

if (window.addEventListener) {
  window.addEventListener('load',videoPlayer,false);
}
else if (window.attachEvent) { 
  window.attachEvent('onload',videoPlayer);
}

然后我有：

if (window.addEventListener) {
  window.addEventListener('load',somethingelse,false);
} else if (window.attachEvent) { 
  window.attachEvent('onload',somethingelse);
}

将它们全部放在一起是首选/功能吗？像

if (window.addEventListener) {
  window.addEventListener('load',videoPlayer,false);
  window.addEventListener('load',somethingelse,false);
} else if (window.attachEvent) { 
  window.attachEvent('onload',videoPlayer,false);
  window.attachEvent('onload',somethingelse);
}

Answer 1

你可以做你想做的事。它们不必在一起，这取决于代码的上下文。当然，如果你可以将它们组合在一起，那么你应该这样做，因为这可能会使代码的结构更加清晰（在“现在我们正在添加所有事件处理程序”的意义上）。

但有时您必须动态添加事件侦听器。但是，没有必要多次测试您是否正在处理IE。

最好是从这里抽象出来，只测试加载页面时哪种方法可用。像这样：

var addEventListener = (function() {
    if(document.addEventListener) {
        return function(element, event, handler) {
            element.addEventListener(event, handler, false);
        };
    }
    else {
        return function(element, event, handler) {
            element.attachEvent('on' + event, handler);
        };
    }
}());

这将测试一次使用哪种方法。然后，您可以使用以下命令在整个脚本中附加事件：

addEventListener(window, 'load',videoPlayer);
addEventListener(window, 'load',somethingelse);

Answer 2

我使用这个功能：

function addEvent (obj, type, fn) {
  if (obj.addEventListener) {

    obj.addEventListener(type, fn, false);

  } else if (obj.attachEvent) {

    obj.attachEvent('on' + type, function () {

      return fn.call(obj, window.event);

    });
  }
}

Answer 3

/**
 * multipleEventsListeners.js
 * Add the capability to attach multiple events to an element, just like jQuery does
 * https://gist.github.com/juanbrujo/a1f77db1e6f7cb17b42b
 */

multipleEventsListeners(events, func, elem) {
  elem = elem || document;
  var event = events.split(' ');
  for (var i = 0; i < event.length; i++) {
    elem.addEventListener(event[i], func, false);
  }
}

/*
Use: 
var input = document.querySelector('input');
multipleEventsListeners(input, 'keyup change', function(e){
  console.log = this.value;
});
*/

来自：https://gist.github.com/juanbrujo/a1f77db1e6f7cb17b42b

可以使用javascript将多个事件侦听器/处理程序添加到同一元素中吗？

3 个答案: