我们常用的事件监听就是利用addEventListener然后后面跟一个具体的方法,例如:

    1. document.getElementById('test').addEventListener('click',function(e){});

    但是addEventListener后面其实跟一个对象,然后默认会去找对象的handleEvent方法:

    1. var obj={
    2.     handleEvent:function(e){
    3.     }
    4. }
    5. document.getElementById('test').addEventListener('click',obj);

    最常用的就是利用它做统一事件处理入口:

    addEventListener之handleEvent

    上面demo的关键代码如下:

    1. var obj={
    2.     handleEvent:function(e){
    3.         switch(e.type){
    4.             case 'mousedown':
    5.                 console.log('mousedown');
    6.                 break;
    7.             case 'mouseup':
    8.                 console.log('mouseup');
    9.                 break;
    10.             case 'click':
    11.                 console.log('click');
    12.             break;
    13.         }
    14.     }
    15. }
    16. document.getElementById('main').addEventListener('click',obj);
    17. document.getElementById('main').addEventListener('mousedown',obj);
    18. document.getElementById('main').addEventListener('mouseup',obj);
    回到顶部
    我要评论

    所有评论

      相关文章