jQuery $(document).ready()激发两次
所以我一直在网上search,试图找出在这里发生了什么,我一直没有得到一个具体的答案。
我有一个$(document).ready在我的网站上,无论代码是多less次都可以运行。
我已经阅读了关于jQuery的错误报告,关于.ready事件将如何触发两次,如果你有你的语句中发生的exception。 但是,即使我有下面的代码,它仍然运行两次:
$(document).ready(function() { try{ console.log('ready'); } catch(e){ console.log(e); } });
在控制台中,我所看到的是“准备好”logging两次。 有没有可能是另一个。它有一个例外,会导致一个问题? 我的理解是,所有的.ready标签都是相互独立的,但是我似乎无法find这里起作用的地方?
这里是网站的头块:
<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>
不要关注JSPvariables,但正如你所看到的,我只调用一次functions.js文件(这是.ready函数存在的地方)
准备好的事件不能发射两次。 更有可能发生的是你有移动或操纵代码被包含在其中的元素的代码导致浏览器重新执行脚本块。
这可以通过在<head>
包含脚本标签,或者在closures</body>
标签之前,而不是使用$('body').wrapInner();
。 使用$('body').html($('body').html().replace(...));
具有相同的效果。
这也发生在我身上,但是我意识到这个剧本因为合并错误而被包含了两次。
这发生在我身上时,使用KendoUI …调用一个popup窗口将导致document.ready
事件多次触发。 简单的解决scheme是设置一个全局标志,以便它只运行一次:
var pageInitialized = false; $(function() { if(pageInitialized) return; pageInitialized = true; // Put your init logic here. });
这是一种黑客,但它的作品。
确保你没有包含JS文件两次。 那是我的情况
你可以考虑使用
window.onload
代替
$(document).ready
尝试把这个在你的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 }
不过,我build议你多看看,看看你第二次打电话到哪里。
当我试图刷新一个部分时,我遇到了类似的问题。 我调用返回ActionResult而不是返回PartialViewResult。 ActionResult导致我准备()运行两次。
在html中添加两次相同的控制器时,可能会遇到此问题。
举个例子:
[JS]
app.controller('AppCtrl', function ($scope) { $(document).ready(function () { alert("Hello"); //this will call twice }); });
[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>
在我的情况下,$(document).ready因为坏的CSS而被激发了两次,检查你的CSS的任何部分是否有background-image: url('');
如果iframe不显示任何东西,并用于其他原因(如上传文件,而不重新加载),你可以做这样的事情:
<iframe id="upload_target" name="upload_target" style="width:0;height:0;border:0px solid #fff;"></iframe>
请注意,不包含src,以防止文档上的第二个就绪触发器。
我有这个问题与window.load函数被执行两次:原因是因为我已经在主页面以及.net用户控件引用相同的JavaScript文件。 当我删除主页中的引用时,加载函数只执行一次。