jQuery的ready函数被调用两次

Question

这是我的 HTML

<div id="projekt" style="position: relative; width: 90%;height:400px;"/>

 $("#projekt").ready(function() {

     .. do something with the div
 });

问题在于 ready 函数被调用了两次。可能的原因是什么？

- user137348

---

你能展示一下你的HTML代码吗？很有可能你添加了两次，或者甚至多次引用了jQuery库。 - hunter

你可能有两个 id='projekt' 的元素吗？ - Spudley

是的，我引用了两次jQuery。但只有一个带有jquery的脚本元素。当我移除这个元素时，两个jQuery引用都消失了。很奇怪。 - user137348

Answer 1

如果你重复引入同一个 JavaScript 文件，它将被执行两次。在 Firebug 中并不明显。在 script 面板（我用来调试 JavaScript 问题的地方）中，文件在下拉菜单中只会显示一次。但是如果你查看 html 或者 net 面板，就可以看到是否有多个文件。

我的代码大致如下：

<script src="/scripts/project.js" type="text/javascript"></script>
<script src="/scripts/project.js" type="text/javascript"></script>

(这类似于 @chs 的答案，但不只限于rails。)

- Joe Flynn

---

这是我的“ready”函数触发两次的原因。我在tiles-template“layout”中只包含了一次js文件... - 然后，又通过tiles-definition“add-attribute”再次包含了相同的文件。谢谢！ - sairn

Answer 2

有一个错误可能会导致这种情况。尝试更新或绑定到文档，而不是 div。具体信息请查看此处。

- Craig Stuntz

---

+1 - 最有可能的原因是1.4.3版本的bug，因为选择器并不重要...你可以使用$("#IDJFmliiojfasdfll").ready()，它会正常工作 :) - Nick Craver

我尝试更新到1.4.4rc2，但错误仍然存在。我正在使用$(document).ready()... - nornagon

我找到了问题所在：我的ready函数抛出了异常...这导致了ready处理程序没有注册ready事件已经被处理的情况。详见http://bugs.jquery.com/ticket/7273。 - nornagon

@nornagon - +1！那就是我的问题的答案。 - sscirrus

Answer 3

我找到了解决这个问题的方法。

你应该使用这段代码。

$(document).bind("ready", MyDocumentReadyHandler)

用文本代替代码

$(document).ready(...);

你可以使用此url了解更多关于“ready”函数的信息。

- user1091132

Answer 4

如果在 iframe 中使用错误的 src，例如 <iframe src="../" ...></iframe>，则函数 ready() 将被执行两次。请确保您拥有一个有效的 URL。

Ex.:

<iframe src="../something.html" ... ></iframe>

- Fábio Almeida

Answer 5

我曾经遇到过这种情况，当我在.ready回调函数中的某个地方有一个alert('...');时。这种情况最近发生在jQuery 1.5.2中。将alert移除后，代码只会运行一次。

- KevinM

Answer 6

在config/application.rb文件中的以下标签中不需要添加应用程序选项：

config.action_view.javascript_expansions[:defaults] = %w(jquery application)

这将导致application.js文件被调用两次，因此您的应用程序中的函数也会运行两次。

- chaitanya

Answer 7

调用ready()的正确方法是通过document：

$(document).ready(function() {
    ...
});

- Xion

---

$().ready(handler)是等价的，但不建议使用。为什么不建议使用？ - Grastveit

Answer 8

我曾经遇到过同样的问题。当我将JS移动到另一个文件中并在head标签中引用它而不是放在我正在处理的div下面时，问题就解决了。

- anon

Answer 9

当使用JQM（jQueryMobile）时，您将遇到相同的问题，但在我的情况下，问题是有重复的data-role =“content”属性。该属性触发处理具有该属性的特定div或元素内部的所有内容。在我的情况下，一个.ready函数被两次包装，并因此执行了两次。希望这能帮助某些人。

- JamesRLamar