jquery 绑定事件累加

最新推荐文章于 2023-12-08 11:05:38 发布

缺角的10元钱

最新推荐文章于 2023-12-08 11:05:38 发布

阅读量706

点赞数

分类专栏： jquery 文章标签： jquery

本文链接：https://blog.csdn.net/wokao_gp/article/details/49786953

版权

jquery 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

**使用jquery绑定事件会进行事件累加，即在一个元素上绑定多个事件这些事件都会执行，为防止这种情况，在绑定事件前先进行unbind解绑操作，然后再绑定新的事件。
例如，点击一个按钮A后触发的funcA（），在funcA（）中会在另一个元素B上绑定click事件funcB（），若在绑定funcB（）之前不进行unbind操作，则会出现，点击多次A按钮后，会将之前绑定到B上的funcB（）依次累加全部绑定到B上，这样再去点击B的时候就会触发多次funcB（）方法。**

参考文档：
http://www.cnblogs.com/mabelstyle/p/3824455.html
http://www.cnblogs.com/yuanyuan/archive/2012/02/09/2343647.html

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <title>Document</title>
 </head>
 <body>
  累加事件：
  <button id="a" >A:点我给B标签绑定事件</button>
  <button id="b">B:点我触发绑定在我身上的事件</button>
  <br/>
  不累加事件：
  <button id="c" >C:点我给D标签绑定事件</button>
  <button id="d">D:点我触发绑定在我身上的事件</button>
  <script >
    $(document).ready(function(){
        //事件累加
        $("#a").click(function(){
             $("#b").click(function(event){
                alert("trigger b:处罚次数与点击a的次数相关");
            }); 
        }); 

        //事件解绑后不累加
        $("#c").click(function(){
             $("#d").unbind("click").click(function(event){
                alert("trigger d:只触发一次");
            }); 
        }); 
    });
  </script>
 </body>
</html>