Jquery点击事件触发多次解决办法

最新推荐文章于 2022-09-07 19:36:54 发布

Gary_Leong

最新推荐文章于 2022-09-07 19:36:54 发布

阅读量2.3k

点赞数 1

分类专栏： js 文章标签： JavaScript js 前端

原文链接：https://blog.csdn.net/qq_41559229/article/details/82801116

版权

js 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

在用jquery绑定事件的时候，一般来说习惯性都是喜欢绑定匿名事件。比如下面的：

<body>
<input type="button" class="dv" value="按钮">
<script src="js/jquery-3.3.1.js"></script>
<script type="text/javascript">
    $(function () {
        $(".dv").click(function () {// 第一种
            alert("Hello World");
        });

        $(".dv").on("click",function () { //第二种
            alert("Hello World");
        });

        $(".dv").bind("click",function () {  //第三种
            alert("Hello World");
        })
    })

</script>
</body>

由于是匿名事件，所以假如你这个事件是放在一个for循环里面的话，这样的匿名事件是会重复的叠加叠加上去，
之所以会叠加，是因为是匿名事件，会重复的创建空间给这个匿名事件，所以才会导致叠加，这个问题可以后面解决。

我用的解决方案：
在绑定这个事件之前，我们先解绑之前绑定的事件，这样就可以保证每次操作的时候都是只有一个时间，具体的操作就是，如果用on绑定的事件，你就用off取消绑定，再用on绑定事件。代码如下：

    $('.preset-list.fillL3').off('click', '.preset-list-button');
    $('.preset-list.fillL3').on('click', '.preset-list-button', function () {
        presetClick($(this)[0]);
    });

如果你用的是bind绑定的话就用unbind取消绑定，这样就可以避免使用匿名事件的时候事件会重复叠加到挂载元素中。

Gary_Leong

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Jquery点击事件触发多次解决办法

在用jquery绑定事件的时候，一般来说习惯性都是喜欢绑定匿名事件。比如下面的：<body><input type="button" class="dv" value="按钮"><script src="js/jquery-3.3.1.js"></script><script type="text/javascript"> ...
复制链接

扫一扫