事件监听器多次为ajax驱动的html工作

Question

utilities.js：

self.gesture.delegate

布局：

// on is used because html is dynamic
$(document).on('click', '#next_campaign', function() {
    console.log('hello');
});

查看：

在包含<script src="utilities.js"></script> 按钮的布局上使用ajax()加载了一个视图。

问题是，如果视图加载了n次，那么它的监听器也可以正常运行。表示如果加载了2次视图，那么点击#next_campaign将触发事件2次，所以输出将 你好2次 ，如：

  

您好

     

您好

有人可以指导我在哪里做错了吗？

Answer 1

因为在每次加载时都会附加click事件，你可以使用jQuery方法 off() 来删除点击事件（如果有的话），然后再使用它on()：

$(document).off('click', '#next_campaign').on('click', '#next_campaign', function() {
    console.log('hello');
});

希望这有帮助。