zoukankan      html  css  js  c++  java
  • 通过原生JS实现为元素添加事件

    自己写了一个为元素添加事件的方法,并封装到对象中。

    说明:

      id : 目标元素的ID

      type: 事件的类型,注意的是不能加on

       fn:事件处理程序

         isBubble :规定事件流

    代码:

     1     var bindEvent = {
     2 
     3         'add':function(id,type,fn,isBubble){
     4 
     5             var dom = document.getElementById(id);
     6             if(!isBubble) isBubble=false;
     7             if(dom.addEventListenner){
     8                 dom.addEventListenner(type,fn,isBubble);
     9             }else if(dom.attachEvent){
    10                 Transit = function(){
    11                     fn.call(dom);
    12                 }
    13                 dom.attachEvent('on'+type,Transit);
    14             }else{
    15                 dom['on'+type] = fn;
    16             }
    17         },
    18         'remove':function(id,type,fn,isBubble){
    19             var dom = document.getElementById(id);
    20             if(!isBubble) isBubble=false;
    21             if(dom.removeEventListenner){
    22                 dom.removeEventListenner(type,fn,isBubble)
    23             }else if(dom.detachEvent){
    24                 dom.detachEvent('on'+type,Transit)
    25             }else{
    26                 dom['on'+type]=null;
    27             }
    28 
    29         }
    30 
    31     }

    调用方法:

      //定义事件处理程序
     function msg(){
        alert(this.tagName)
     }
    //为目标元素绑定事件 bindEvent.add('link','click',msg,false); //解除目标元素绑定的事件 bindEvent.remove('link','click',msg,false);
  • 相关阅读:
    如何设计一个百万级用户的抽奖系统?
    服务注册发现
    消息列队7
    消息列队6
    bzoj 4771: 七彩树
    [SDOI2013]刺客信条
    bzoj 5291: [Bjoi2018]链上二次求和
    51nod 1245 Binomial Coefficients Revenge
    bzoj 5308: [Zjoi2018]胖
    bzoj 5294: [Bjoi2018]二进制
  • 原文地址:https://www.cnblogs.com/HCJJ/p/5009520.html
Copyright © 2011-2022 走看看