关于jquery的$(document).on()事件多次执行的问题
时间: 2023-10-09 22:12:03 浏览: 67
$(document).on() 是 jQuery 中用于绑定事件处理程序的方法,它可以在动态加载元素的情况下仍然能够为这些元素绑定事件。但是,如果在使用 $(document).on() 绑定事件时不小心重复绑定了相同的事件处理程序,就会导致事件被触发多次。
解决方法有以下几种:
1. 在绑定事件前先解绑之前绑定的事件,这样可以避免重复绑定问题。例如:
```
$(document).off('click', '#myButton').on('click', '#myButton', function() {
// do something
});
```
2. 判断事件是否已经绑定,如果已经绑定,则不再绑定。例如:
```
if (!$(document).data('events') || !$(document).data('events').click) {
$(document).on('click', function() {
// do something
});
}
```
3. 在事件处理程序中添加一个标志,如果标志为 true,则不再执行。例如:
```
$(document).on('click', '#myButton', function() {
if ($(this).data('clicked')) {
return;
}
$(this).data('clicked', true);
// do something
});
```
以上是几种常见的解决方法,可以根据具体情况选择适合自己的方法。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![ppt](https://img-home.csdnimg.cn/images/20210720083527.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)