Javascript .on（）.off（）事件冒泡问题（非常混乱…）

首先让我说，这让我痛苦了好几个小时，我已经尽了最大的努力寻找资源并理解为什么会发生这种情况

我有一个使用AJAX的文件浏览器

加载新目录时，必须重新初始化事件处理程序

当我更改目录时，它会堆叠起来

因此，如果我说

files/./files/.

返回根目录（两次），它会触发4次

我尝试过使用

.off（）

解除绑定，我尝试过使用

.one（）

进行限制，我尝试过使用

$（文档）重置所有绑定。查找（'*'）.off（）

，对于特定事件，我尝试过

e.stopPropagation（）

似乎什么都不管用。这让我快发疯了。如果不重新初始化系统，则通过AJAX加载的新内容不会收到绑定。如果我这样做，它会堆叠起来。请帮忙

//previous method
file.on('click',dothis);
//method that actually works
files.on('click','a',dothis);

与其尝试清除所有事件处理程序，然后重新安装所有程序，不如有两种更干净的方法来解决问题：

您只能将新加载的HTML重新斜体化，这样就不会在现有内容上获得任何双重事件处理程序。通常的方法是确定选择器的范围，将事件处理程序添加到新内容的父对象中，方法是将新内容的选择器放在选择器的开头或将其作为上下文传递（第二个参数）

您可以切换到在静态公共父级上使用委托事件处理程序，这样即使对于动态内容，也不必重新初始化事件处理程序

对于委托事件处理，您将使用以下形式的事件处理程序：

$("some static parent selector").on("click", "child object selector", fn);

静态父选择器本身不需要动态加载，动态内容需要是它的子级。您甚至可以对静态父级使用
$（document）
，但选择一个更接近动态内容的父级（为了提高事件路由的效率）会更好

以下是一些有关委派事件处理的常用参考资料：






要仅重新斜体显示新加载的HTML，只需在选择器前面加上新加载内容的父项：

$("#parentOfDynamicContent .myAnchors").on("click", fn);

或者，像这样：

$("#parentOfDynamicContent").find(".myAnchors").on("click", fn);

确实要在插入的父元素上设置
.on（）
？
on（）
不侦听在设置之前插入的元素，您需要将其设置为DOM父级

代码可能会有所帮助，可能就在您设置on（）和off（）和一些基本html结构的地方

用法示例：

$('#parent').on('click', 'a', function(e) {

});

这将侦听对
#parent
中
a
元素的所有单击。如果使用事件委派，则不需要重新初始化事件处理程序。请发布演示问题的最小代码量。请查看jQuery的.on（）中的[selector]参数。这将允许事件委派到您不需要再添加/删除事件绑定的位置。这是一个真正的救命恩人。非常感谢。