Skip to main content

Bug Tracker

Side navigation

#4406 closed bug (duplicate)

Opened March 23, 2009 10:47PM UTC

Closed November 09, 2009 12:40PM UTC

Last modified March 14, 2012 02:12PM UTC

jQuery doesn't wait for page to load.

Reported by: Phil Owned by:
Priority: major Milestone: 1.4
Component: support Version: 1.3.2
Keywords: Cc:
Blocked by: Blocking:
Description

On pages that take a while to load (few seconds) jQuery trys to access document.body before it has fully loaded.

This causes no jQuery scripts to be executed on the page.

I am getting this error repeatedly on certain pages of my website.

The piece of code causing the issue is:

Figure out if the W3C box model works as expected

document.body must exist before we can do this

jQuery(function(){

var div = document.createElement("div");

div.style.width = div.style.paddingLeft = "1px";

document.body.appendChild( div );

jQuery.boxModel = jQuery.support.boxModel = div.offsetWidth === 2;

document.body.removeChild( div ).style.display = 'none';

});

Despite the fact the comment correctly points out that document.body must exist there is no check done to ensure it does exist, hence causing a script error.

Attachments (0)
Change History (7)

Changed March 24, 2009 02:09AM UTC by Phil comment:1

I've played around with this a bit and have come to the conclusion that it may be an issue with Firefox itself.

Firefox should send the ready event when the HTML is loaded but not nescessarily all the images, the remaining image on one page of my site is a background illustration of around 250kb which takes a couple of seconds to load, however if I modify the jQuery code with the following:

$(document).ready(function() {

jQuery(function(){

var div = document.createElement("div");

div.style.width = div.style.paddingLeft = "1px";

document.body.appendChild( div );

jQuery.boxModel = jQuery.support.boxModel = div.offsetWidth === 2;

document.body.removeChild( div ).style.display = 'none';

});

});

Which should work in theory as at this point the HTML should all be loaded I still get the error.

Change this to an onload as follows:

window.onload = function() {

jQuery(function(){

var div = document.createElement("div");

div.style.width = div.style.paddingLeft = "1px";

document.body.appendChild( div );

jQuery.boxModel = jQuery.support.boxModel = div.offsetWidth === 2;

document.body.removeChild( div ).style.display = 'none';

});

};

The error is gone, the jQuery effects and plugins also seam to function normally with this modification.

I'm sure this isn't an ideal solution but rather than sift through 4,000 lines of unfamiliar code looking for a better alternative it seams to be an adequate work around for now.

Changed March 25, 2009 03:25AM UTC by brandon comment:2

need: ReviewTest Case

Please create a simplified test case that shows where this is failing for you.

Changed March 25, 2009 03:26AM UTC by brandon comment:3

priority: blockermajor

Changed March 25, 2009 10:39AM UTC by Phil comment:4

I have modded the jquery source on my website but I can revert it back to the original 1.3.2 file and give you the link?

If I repeatedly press f5 on the home page with 1.3.2 I get repeated errors in the FF console.

Changed June 07, 2009 04:17PM UTC by andras comment:5

I'm getting the same error. I just wanted to point out that i'm using IE and it's quite random. I'm getting the impression there are some delays declaring document.body.

Changed October 19, 2009 01:50AM UTC by dmethvin comment:6

Duplicate of #4320.

Changed November 09, 2009 12:40PM UTC by john comment:7

resolution: → duplicate
status: newclosed