javascript - 在 AJAX 刷新时，所有 JavaScript 事件都中断了

Question

当用户单击过滤器链接时，我正在执行 AJAX 调用以替换页眉下方的所有内容和页面页脚上方的所有内容。

问题是在 AJAX 事件之后，绑定(bind)到各种 DOM 元素的所有 JavaScript 事件都会中断。这是有道理的，因为它们绑定(bind)在一个低得多的模块级示例上

$(".innerDiv").on("click",function(){doSomething();}

并且通过替换父容器的内容，这些事件不再被绑定(bind)。

处理这个问题的正确方法是什么？我可以将事件监听器添加到更高级别，例如

$(document).on("click",".innerDiv",function(){doSomething();}

但这会带来同样的低效和问题，jQuery 中的 live() 函数已被弃用。

我发现建议的另一个解决方案是在 AJAX 调用后重新绑定(bind)事件。问题是我要处理的是一个相当复杂的页面，它包含许多 JavaScript 模块，每个模块都有自己的绑定(bind)。我将如何跟踪每个绑定(bind)的事件？有什么方法可以从 jQuery 中访问这些信息吗？我应该维护我自己的所有绑定(bind)了事件的元素的数据结构吗？

在发出 AJAX 请求之前，我是否还需要使用“off()”函数取消绑定(bind)事件？

谢谢你的帮助

Answer 1

在 JQuery 中可以使用 beforeSend http://api.jquery.com/jQuery.ajax/解除绑定(bind)事件