JQuery $(document) . ready()触发两次

小开

最佳答案

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 not using $('body').wrapInner();. using $('body').html($('body').html().replace(...)); has the same effect.

小开

try putting this in your functions.js to prevent it from being executed twice :

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.

小开

This happened to me when using KendoUI... invoking a popup window would cause the document.ready event to fire multiple times. The easy solution is to set a global flag so that it only runs once:

var pageInitialized = false;
$(function()
{
if(pageInitialized) return;
pageInitialized = true;
// Put your init logic here.
});

It's sort of hack-ish, but it works.

小开

It happened to me also, but I realized that the script had been included twice because of a bad merge.

小开

You might consider to use

window.onload

instead of

$(document).ready

小开

Make sure you don't include JS file twice. That was my case

小开

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.

小开

There is a possibility to encounter this problem when you add same controller twice in the html.
For an instance:
[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>

小开

In my case $(document).ready was firing twice because of bad CSS, check if any part of your CSS has background-image: url('');

小开

If the iframe doesnt show anything and is used for other reasons (like uploading a file without reload) you can do something like this :

<iframe id="upload_target" name="upload_target" style="width:0;height:0;border:0px solid #fff;"></iframe>

Notice that src is not included that prevents the second on ready trigger on the document.

小开

I had this problem with window.load function was executed twice: The reason was because I had reference to the same javascript-file in the main page as well as a .net usercontrol. When I removed the reference in the main page, the load-function was only executed once.

小开

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.

See document.ready function called again after submit button? here on stackoverflow for more details.

小开

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 JavaScript Library v1.8.3 (yes, it is a legacy app)

小开

My problem was that I had tags referencing my JS file in both my index.cshtml file AND my _Layout.cshtml. This was causing the document.ready function to fire twice, which was causing DataTables to bomb.