$(document).ready()什么时候触发? [英] When does $(document).ready() fire?

查看:129
本文介绍了$(document).ready()什么时候触发?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这个问题的评论让我想到了一些事情。当$ $(document).ready()功能完全消失时?明显的答案是当文档准备好了,但是恰恰是这样吗?



例如,如果我输出缓冲区,并在PHP继续执行时刷新输出,那么不会将输出发送到浏览器?那么在PHP脚本执行完毕之前,文件是否可以准备就绪,还是等待请求完成?






编辑:



答案似乎基本上同意客户端认为准备就绪的事件。 >

为了更好地理解(我应该首先做的),我只是设置了一个测试:

 <?php ob_start(); ?> 
< html>
< head>
< script type =text / javascriptsrc =lib / js / jquery-1.7.1.min.js>< / script>
< script type =text / javascript>
$(document).ready(function(){
alert(READY);
});
< / script>
< / head>
< body>
<?php
ob_flush(); ($ i = 0; $ i< 999999; $ i ++)
{
echoHELLO $ i\\\
;
ob_flush();
}
?>
< / body>
< / html>

结果是在这个例子中,内容开始在页面上显示,但是警报直到循环完成,或脚本超时(30秒)才发生。



根据您使用的浏览器,我尝试插入此在我的循环中:

  if($ i == 99){
echo< / body> / HTML>中;
}

Chrome似乎通过将这些标签放在页面(如web开发人员检查器中所示)。查看页面的来源显示在中间,在那里我回显了。

解决方案

jQuery的<$ c $一旦jQuery确定DOM可以访问,文档的c> ready 事件就会触发。确切的机制取决于浏览器。



查看相关的源代码



首先,检查DOM是否已经在尝试将侦听器绑定到事件的时刻可访问。如果是这样,回调计划立即启动,尽管它们不是立即实际发射,以允许代码已经占用当前执行槽,以便在需要时取消处理程序。



如果DOM尚未访问,则尝试将事件侦听器绑定到浏览器的本机 DOMContentLoaded 事件 - 这是要求浏览器通知您的正确当DOM可用时,它是一个比较现代的功能。如果这是不可能的(这几乎肯定表明你的代码是在旧版本的IE中运行),代码可以归结为几种机制:




  • 尝试附加到文档的 onreadystatechange 事件。这不是愚蠢的,将会晚于 DOMContentLoaded 会是,但它是相当不错的。

  • 回到加载事件的窗口对象。这通常比DOM更晚,但它是最后一个故障安全,以确保事件将始终触发。

  • 最坏的情况:保持轮询DOM直到它可以访问。



从PHP的角度来看,这是可能(但不太可能) PHP脚本执行完毕。有些情况(例如长时间轮询),在脚本完成之前事件将触发,但这只会在较旧的浏览器中出现。然而,在这些情况下,您根本不会(不应该)使用这些事件,您只需将适当的< script> 元素放在该页面允许它们在加载后立即执行,而无需等待DOM的其余部分。



个人而言,我从不使用任何这些加载驱动事件,或多或少是因为这个原因。 YMMV。


The comments from this question got me thinking about something. When exactly does the $(document).ready() function fire? The obvious answer would be "when the document is ready," but when exactly is that?

For instance, if I turned output buffering on and flushed my output while PHP continued executing, wouldn't that send output to the browser? So is there any way the document could be ready before the PHP script has finished executing, or does the event wait until the request has finished?


EDIT:

The responses seem to basically agree that the event fires when the client thinks it's ready.

To get a better understanding (which I should have probably done in the first place), I just set up a test:

<?php ob_start(); ?>
<html>
<head>
    <script type="text/javascript" src="lib/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            alert("READY");
        });
    </script>
</head>
<body>
<?php
    ob_flush();
    for ($i=0; $i<999999; $i++) {
        echo "HELLO$i\n";
        ob_flush();
    }
?>
</body>
</html>

The result was that in this example, the contents began showing on the page right away, but the alert didn't happen until the loop was done, or the script timed out (30 seconds).

To the point of depending on which browser you use, I tried inserting this in my loop:

if ($i == 99) {
    echo "</body></html>";
}

And Chrome seemed to automatically correct it by putting those tags at the end of the page (as seen in the web dev inspector). Viewing the source of the page showed it in the middle, where I echo'ed it though.

解决方案

jQuery's ready event for the document fires as soon as jQuery determines that the DOM is accessible. The exact mechanism depends on the browser.

Take a look at the relevant source code.

Firstly, there is a check to see if the DOM is already accessible at the point where an attempt was made to bind a listener to the event. If it is, the callbacks are scheduled to fire immediately - although they are not actually fired immediately, to allow the code already occupying the current execution slot to cancel the handlers if required.

If the DOM is not yet accessible, an attempt is made to bind an event listener to the browser's native DOMContentLoaded event - this is the "correct" native way to ask the browser to inform you when the DOM is available, but it's a relatively modern feature. If this is not possible (this almost certainly indicates you code is running in an older version of IE), the code falls back to a couple of mechanisms:

  • Try and attach to the onreadystatechange event of the document. This is not fool-proof and will be later than DOMContentLoaded would have been, but it's pretty good.
  • Fall back to the load event of the window object. This will often be much later than the DOM is available, but it's a last-ditch failsafe to ensure the event will always fire eventually.
  • The worst case scenario: keep polling the DOM until it's accessible.

From a PHP perspective, it is possible (but unlikely) for this to occur before your PHP script has finished executing. There are situations (such as long-polling) where the event would fire before your script is finished, but this would only occur in older browsers. However, in these scenarios, you wouldn't (shouldn't) be using these events at all, you would simply place the appropriate <script> elements in the body of the page to allow them to be executed as soon as they are loaded, without waiting for the rest of the DOM.

Personally, I never use any of these load-driven events, more or less for that reason. YMMV.

这篇关于$(document).ready()什么时候触发?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆