javascript - 是否有与 AJAX 加载部分的页面等效的 document.ready ？

Question

我有一个包含多个部分的主页。每个部分都定义一个 (document).ready 事件，调用一个函数。该函数是唯一的，并且在该节本身内定义。 例如

Main.htm

section1:定义 funcABC()。 (文档).ready 调用 funcABC();

第2节:定义funcDEF()。 (文档).ready 调用 funcDEF();

section3:定义 funcXYZ()。 (文档).ready 调用 funcXYZ();

等等..

因此页面加载，每个部分调用它需要的函数，一切正常。

页面现已更改为通过 AJAX (jquery.load()) 加载各部分。上面显示的布局不再像 (document).ready 那样工作。ready 仅在 Main.htm 加载时触发，但部分已加载时不触发。

Main.htm 无法调用各部分中的函数，因为它不知道每个部分需要哪些函数，并且没有定义(在每个部分中动态生成)。

我知道这个设计很奇怪，这是我继承的并且必须使用的东西..

我基本上需要每个部分在加载后都有自己的功能，就像它所做的那样。我怎样才能做到这一点？

Answer 1

(document).ready 是加载 DOM 时事件的处理程序，但是，您会触发一些 AJAX 事件，并且希望在事件成功完成时执行一个函数。服务器响应时执行的函数称为回调函数。假设您有一个函数，如下所示:

function() myFunction {
    //...
}

您希望 myFunction 作为回调函数执行。假设您使用 jquery.load，如下所示:

$( "#result" ).load( "ajax/test.html", function() {
   myFunction();
}); 

这是一个事件处理程序，它将请求发送到“ajax/test.html”，当响应到达时，执行作为参数传递的未命名函数。此未命名函数调用 myFunction。