Javascript jQuery $(document).ready() 触发两次
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10727002/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery $(document).ready () fires twice
提问by Xenology
I've been sifting around the web trying to find out whats going on here and I have not been able to get a concrete answer.
我一直在网上筛选，试图找出这里发生了什么，但我没有得到具体的答案。
I have one $(document).readyon my site that seams to run multiple times regardless of the code that is inside it.
$(document).ready我的网站上有一个接缝运行多次，而不管其中的代码如何。
I've read up on the bug reports for jQuery about how the .readyevent will fire twice if you have an exception that occurs within your statement. However even when I have the following code it still runs twice:
我已经阅读了 jQuery 的错误报告，了解.ready如果您的语句中发生异常，该事件将如何触发两次。但是，即使我有以下代码，它仍然会运行两次：
$(document).ready(function() {
try{
console.log('ready');
}
catch(e){
console.log(e);
}
});
In the console all I see is "ready" logged twice. Is it possible that another .ready with an exception in it would cause an issue? My understanding was that all .ready tags were independent of each other, but I cannot seem to find where this is coming into play?
在控制台中，我看到的只是“准备好”记录了两次。另一个 .ready 是否有可能会导致问题？我的理解是所有 .ready 标签都是相互独立的，但我似乎无法找到它在哪里发挥作用？
Here is the head block for the site:
这是该站点的头部块：
<head>
<title>${path.title}</title>
<meta name="Description" content="${path.description}" />
<link href="${cssHost}${path.pathCss}" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="media/js/fancybox/jquery.fancybox.pack.js" type="text/javascript" ><!-- --></script>
<script src="/media/es/jobsite/js/landing.js" type="text/javascript" ><!-- --></script>
<script src="/media/es/jobsite/js/functions.js" type="text/javascript"><!-- --> </script>
<script src="/media/es/jobsite/js/jobParsing.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="/media/es/jobsite/js/queryNormilization.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="${jsHost}/js/jquery/jquery.metadata.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="${jsHost}/js/jquery/jquery.form.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="${jsHost}/js/jquery.i18n.properties-min.js" type="text/javascript" charset="utf-8"><!----></script>
<script type="text/javascript" charset="utf-8">
function updateBannerLink() {
var s4 = location.hash.substring(1);
$("#banner").attr('href','http://INTELATRACKING.ORG/?a=12240&c=29258&s4='+s4+'&s5=^');
}
</script>
</head>
Pay no attention to the JSP variables, but as you can see i'm only calling the functions.js file once (which is where the .ready function exists)
不要注意 JSP 变量，但正如您所看到的，我只调用了 functions.js 文件一次（这是 .ready 函数所在的位置）
采纳答案by Kevin B
The ready event cannot fire twice. What is more than likely happening is you have code that is moving or manipulating the element that the code is contained within which causes the browser to re-execute the script block.
就绪事件不能触发两次。更有可能发生的是您的代码正在移动或操纵包含代码的元素，从而导致浏览器重新执行脚本块。
This can be avoided by including script tags in the <head>or before the closing </body>tag and notusing $('body').wrapInner();. using $('body').html($('body').html().replace(...));has the same effect.
这可以通过<head>在结束</body>标记中或之前包含脚本标记而不使用$('body').wrapInner();. 使用$('body').html($('body').html().replace(...));具有相同的效果。
回答by Charles HETIER
It happened to me also, but I realized that the script had been included twice because of a bad merge.
它也发生在我身上，但我意识到由于合并错误，该脚本已被包含两次。
回答by qJake
This happened to me when using KendoUI... invoking a popup window would cause the document.readyevent to fire multiple times. The easy solution is to set a global flag so that it only runs once:
这发生在我使用 KendoUI 时......调用弹出窗口会导致document.ready事件多次触发。简单的解决方案是设置一个全局标志，使其只运行一次：
var pageInitialized = false;
$(function()
{
if(pageInitialized) return;
pageInitialized = true;
// Put your init logic here.
});
It's sort of hack-ish, but it works.
这有点像hack-ish，但它有效。
回答by kakauandme
Make sure you don't include JS file twice. That was my case
确保您没有两次包含 JS 文件。那是我的情况
回答by hvdd
You might consider to use
你可以考虑使用
window.onload
instead of
代替
$(document).ready
回答by Mouna Cheikhna
try putting this in your functions.js to prevent it from being executed twice :
尝试把它放在你的functions.js 中以防止它被执行两次：
var checkit = window.check_var;
if(checkit === undefined){ //file never entered. the global var was not set.
window.check_var = 1;
}
else {
//your functions.js content
}
however i suggest that you look more into it to see where are you calling the second time.
但是我建议你多看看它，看看你第二次打电话到哪里。
回答by user3048613
I had a similar problem when I was trying to refresh a partial. I called a return ActionResult instead of a return PartialViewResult. The ActionResult caused my ready() to run twice.
当我尝试刷新部分时遇到了类似的问题。我调用了返回 ActionResult 而不是返回 PartialViewResult。ActionResult 导致我的 ready() 运行两次。
回答by Charitha Goonewardena
There is a possibility to encounter this problem when you add same controller twice in the html.
For an instance:
[js]
当您在 html 中两次添加相同的控制器时，可能会遇到此问题。
例如：
[js]
app.controller('AppCtrl', function ($scope) {
$(document).ready(function () {
alert("Hello");
//this will call twice
});
});
[html]
[html]
//controller mentioned for the first time
<md-content ng-controller="AppCtrl">
//some thing
</md-content>
//same controller mentioned again
<md-content ng-controller="AppCtrl">
//some thing
</md-content>
回答by lominart
I had a similar issue today. A <button type="submit">caused the $(document).ready(...)event to fire again in my case. Changing the code to <button type="button">solved the issue for me.
我今天遇到了类似的问题。在我的情况下，A<button type="submit">导致$(document).ready(...)事件再次触发。更改代码以<button type="button">解决我的问题。
See document.ready function called again after submit button?here on stackoverflow for more details.
请参阅提交按钮后再次调用的 document.ready 函数？在 stackoverflow 上了解更多详细信息。
回答by user3232196
I had this happen to me this morning... and what I discovered after closely examining some html code in a jquery modal form that I had recently manipulated, that I'd accidentally removed a closing table tag. I haven't taken the time yet to fully understand why that caused the document.ready function to be called twice, but it did. Adding the closing table tag fixed this issue.
今天早上我遇到了这种情况……我在仔细检查了我最近操作的 jquery 模态表单中的一些 html 代码后发现，我不小心删除了一个结束表标签。我还没有花时间完全理解为什么这会导致document.ready 函数被调用两次，但确实如此。添加结束表标签修复了这个问题。
jQuery JavaScript Library v1.8.3 (yes, it is a legacy app)
jQuery JavaScript Library v1.8.3（是的，它是一个遗留应用程序）
