Bug Tracker

Modify

Ticket #4406 (closed bug: duplicate)

Opened 5 years ago

Last modified 2 years ago

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:
Blocking: Blocked by:

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.

Change History

comment:1 Changed 5 years ago by Phil

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.

comment:2 Changed 5 years ago by brandon

  • need changed from Review to Test Case

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

comment:3 Changed 5 years ago by brandon

  • Priority changed from blocker to major

comment:4 Changed 5 years ago by Phil

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.

comment:5 Changed 5 years ago by andras

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.

comment:6 Changed 5 years ago by dmethvin

Duplicate of #4320.

comment:7 Changed 4 years ago by john

  • Status changed from new to closed
  • Resolution set to duplicate

Please follow the  bug reporting guidlines and use  jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

View

Add a comment

Modify Ticket

Action
as closed
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.