Question

我正在使用一个非常复杂的.aspx页面，它充满了控件（Telerik，Ajax等），当页面加载时，它们都会展开，折叠，显示，隐藏等。由于这种渲染发生在客户端，并且可以根据用户的机器规格花费不同的时间长度，有没有办法检测何时发生了所有（或某些）渲染（jQuery？），因此我可以根据具体情况采取行动知道它们是完全渲染的元素吗？

Answer 1

JavaScript是单线程的。传递给setTimeout的时间是最小值，但不是最大值，所以如果你传递10（ms）之类的东西，你基本上就是说“在所有当前运行的代码完成后执行这段代码。”

因此，如果所有控件都使用$(document).ready()来完成他们的工作，那么您只需要：

$(document).ready(function() {
    setTimeout(function() {
        doStuff();
    },10);
});

传递给doStuff的所有函数都已运行后，将调用

$(document).ready。但是，这并非万无一失。如果控件有自己的方法来检测文档是否已加载，或者自己执行setTimeout()，则会遇到麻烦。问题是JavaScript不保证setTimeout的执行顺序。有时您的代码可能会运行最后一次，有时可能会在用于动画的setTimeout之前运行。

最后一个想法：如果使用jQuery完成所有动画，则效果在单个队列中运行。在doStuff中，您可以添加某种with a callback的动画，并且可以合理地确定回调最后会运行。

Answer 2

每当我在继续之前必须等待多个事情准备就绪时，我会创建一个具有true / false值的数组。页面的每个必需部分都有一个事件，当它被调用时，会将数组中的特定条目更新为true。此外，它调用了一个通用函数，如果数组中的所有值都为true，则返回true，否则返回false。

如果该函数最终返回true，我将继续执行。如果您必须等待AJAX调用结束但不想使用async = true，这将特别有用。如果你想一次开始加载多个东西而不是一个接一个地加载，它也很有用，因为它们都会将就绪状态报告给同一个数组。

然而，它使用全局变量，因此您可能需要进行一些优化。如果你对全局变量有怨恨，你可能不想这样做。

Answer 3

您应该将代码放在jQuery $（document）.ready（）函数中。这将确保在代码运行之前加载所有元素。

http://docs.jquery.com/Tutorials:Introducing_$(document).ready()

Answer 4

我认为你需要的文件是：

http://docs.jquery.com/Events/load

Answer 5

“我可以对特定元素采取行动，知道它们已完全呈现？”

您可以使用load方法（上面链接）附加到任何元素。所以如果你有一个id为“lastElement”的div，你可以写

$('div#lastElement).load(runThisFunction);

检测何时发生所有HTML页面呈现

5 个答案: