有关事件绑定

最新推荐文章于 2023-02-25 23:25:24 发布

xl900912

最新推荐文章于 2023-02-25 23:25:24 发布

阅读量422

点赞数 1

本文链接：https://blog.csdn.net/u012950186/article/details/38843093

版权

//IE attachEvent

//FF addEventListener element.addEventListener('click',function(e){...},false)

<body> 
      <input type="button" id="bt" name="bt button" value="this is a button"> 
      <script> 
        var bt = document.getElementById("bt"); 
        bt.addEventListener('click',function(e){ 
          alert("this is a alert"); 
          alert(e.currentTarget.name); 
        },false); 
      </script> 
</body>

如此的效果和之前的传统绑定方式是一样的，这种绑定同时支持捕获和冒泡，addEventListener()函数最后的参数表达了事件处理的阶段——false(冒泡)，true(捕获)。这种方式最重要的好处就是对同一元素的同一个类型事件做绑定不会覆盖，会全部生效。比如对上面代码bt元素在进行一次click的绑定，那么两次绑定的事件处理函数都会执行，按照代码书写顺序。

　　但是IE浏览器不支持addEventListener()函数，只能在IE9以上(包括IE9)可以使用，IE浏览器相应的要使用attachEvent()函数代替。

<body> 
      <input type="button" id="bt" name="bt button" value="this is a button"> 
      <script> 
        var name = "world"; 
        var bt = document.getElementById("bt"); 
        bt.attachEvent('onclick',function(){ 
          alert("hello "+ this.name); 
        }); 
      </script> 
</body>