javascript - js事件绑定addEventListener

问题描述

问 题

var events = {

  handleEvent: function(event) {
    switch (event.type) {
      case 'touchstart': this.start(event); break;
      case 'touchmove': this.move(event); break;
      case 'touchend': offloadFn(this.end(event)); break;
      case 'transitionend': offloadFn(this.transitionEnd(event)); break;
    }

    if (options.stopPropagation) {
      event.stopPropagation();
    }

  },
  start: function(event) {
    ...
  },
  move: function(event) {
    ...
  },
  end: function(event) {
    ...
  },
  transitionEnd: function(event) {
    ...
  }
};

element.addEventListener('touchstart', events, false);

代码如上所示，addEventListener事件绑定函数的第二个参数是实现 EventListener 接口的一个对象或函数，我平时使用的都是函数，可是这里的代码传入了一个对象，这种具体是如何绑定的呢？

解决方案

请参考一下这篇文章，希望对你有帮助
http://www.ayqy.net/blog/hand...

add/removeEventListener所接收的第二个参数是一个实现EventListener接口的对象,根据文档
https://www.w3.org/TR/DOM-Lev...
我们可以看到EventListener接口实现了handleEvent方法。
function对象默认实现了Eventlistener 接口，所以我们经常用function去实现这个listener.
如果传入的是一个对象，那么就必须给对象实现handleEvent方法

这篇关于javascript - js事件绑定addEventListener的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！