35

我有一个关于 jQuery 的问题$(document).ready

假设我们有一个包含 2 个JavaScript文件的 HTML 页面

<script language="javascript" src="script1.js" ></script>
<script language="javascript" src="script2.js" ></script>

现在让我们说在这两个脚本文件中,我们有$(document)如下

script1.js 中

$(document).ready(function(){
    globalVar = 1;
})

script2.js 中

$(document).ready(function(){
    globalVar = 2;
})

现在我的问题是:

  1. 这两个准备好的事件函数都会被触发吗?
  2. 如果是,他们被解雇的顺序是什么,因为文件将同时为他们俩准备好?
  3. 是否推荐这种方法,或者理想情况下我们应该只有 1 个 $(document).ready ?
  4. 所有浏览器(IE、FF 等)的执行顺序是否相同?

谢谢你。

4

5 回答 5

34
  1. 这两个准备好的事件函数都会被触发吗?

是的,他们都会被解雇。

  1. 他们被解雇的顺序是什么,因为文件将同时为他们俩准备好?

以它们出现的方式(从上到下),因为 ready 事件会被触发一次,并且所有的事件监听器都会得到一个接一个的通知。

  1. 是否推荐这种方法,或者理想情况下我们应该只有 1 个 $(document).ready ?

这样做是可以的。如果您可以将它们放在同一个块代码中,那么管理起来会更容易,但这就是它的全部。更新:显然我忘了提及,如果您在多个文件中执行此操作,您将增加 JavaScript 代码的大小。

  1. 所有浏览器(IE、FF 等)的执行顺序是否相同?

是的,因为 jQuery 采用了跨浏览器规范化。

于 2011-06-22T06:41:14.283 回答
10

见这里:jQuery - 有多个 $(document).ready(function() {}); 是不是很糟糕 在这里:Tutorials:Multiple $(document).ready()

  1. 是的
  2. 附顺序。jQuery 在内部维护一个readyListwith Deferredobjects
  3. 这部分是口味问题。拥有一个准备好的处理程序将使您对正在发生的所有事情有一个很好的概述,而多个(即每个包含的文件一个)将使您的代码更加模块化(即,您可以包含或删除一个.js文件并确保它提供和绑定自己的就绪处理程序)。
  4. 是的 - 附加顺序。
于 2011-06-22T06:47:39.827 回答
2

在任何当前浏览器中,您都可以指望这两个处理程序按照脚本包含的顺序执行并且globalVar2第二个脚本引用之后执行。

于 2011-06-22T06:39:49.253 回答
-1

如果您想要完全控制,我强烈建议您只使用一个$(document).ready();

如果您通过ajax加载 HTML 的部分部分并且 ajax 响应包含一个 $(document).ready();-script 并且您想要触发 $(document).ready(); 来自ajax 回调中的 script1.js、script2.js 等等.. 你必须复制大量代码....

祝你好运!

/ $(窗口).ready(); ;)

于 2011-06-22T07:00:57.950 回答
-1
  1. 两人都会被解雇
  2. 一旦尘埃落定,变量的值将是 2。
  3. 不推荐的主要事情是使用 2 个不同的 JS 文件,正如 Google PageSpeed 和 Yahoo YSlow 建议的那样,最好将所有 Javascript 代码放在同一个文件中。就相同的事件处理程序而言,老实说,我认为没有理由这样做,它只会使您的代码可读性更差。
  4. 我对此没有答案。
于 2011-06-22T10:13:14.710 回答