I put together that example because it is the most simple piece of code I could create to reproduce the problem. My real process is actually more complicated and there are real gains to be had for using document.ready() in this way. Consider the following two cases:
1. If instead of dynamically loading jQuery when clicking a button what if jQuery was loaded dynamically when the page is loaded? jqueryHasLoaded() will be called when the jQuery script is done loading but that does not mean the dom is ready for manipulation. In this case wrapping the code in $(document).ready() is necessary. 2. What if the code inside jqueryHasLoaded() is actually a 3rd party piece of javascript that uses $(document).ready() and can not be changed? The 3rd party code would not work as expected because the ready event is never fired. Compare that example to this new one where jQuery is loaded statically when the page is loaded: http://www.damagedsoftware.com/earlyjqueryready_test.html $(document).ready() executes immediately after the button is clicked because jQuery has marked the page as ready. I am leaning towards this being an actual bug in jQuery but would like to hear more expert opinions. Ryan Crumley On Oct 7, 8:07 pm, MorningZ <morni...@gmail.com> wrote: > While i don't know the answer to your strange issue... as > "document.ready" fires when, well, when the document is ready.... i > do wonder: why the complexity? > > You aren't gaining anything except on the first load of the library > (and then the browser caches it), heck even that first load is > probably from cache if you are using the Google Ajax CDN > > Again, not the answer to your question I know, but maybe the simple > answer of "re-think your process" is the solution to cross browser > functionality > > On Oct 7, 8:04 pm, Ryan Crumley <crum...@gmail.com> wrote: > > > > > I am experiencing unexpected behavior using $(document).ready() on a > > page where I inject jQuery after the page has loaded and then attach > > listeners to the ready event. The ready() event is never called using > > Firefox and Safari however it is called using IE. > > > Is this a jQuery bug? Is it working as designed? Any suggested work > > arounds? > > > The example at the bottom of the email illustrates the problem. The > > example is also available > > at:http://www.damagedsoftware.com/latejqueryready_test.html > > > Thanks, > > > Ryan Crumley > > > <html> > > <head> > > <script> > > function jqueryHasLoaded() { > > alert("jquery was loaded. Adding ready listener. > > Should see another > > alert from ready."); > > $(document).ready(function() { > > alert("Hello from read()"); > > }); > > } > > > function loadjquery() { > > var url = > > "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/ > > jquery.js"; > > var head = > > document.getElementsByTagName("head")[0], done = false; > > var script = document.createElement("script"); > > script.src = url; > > > script.onload = script.onreadystatechange = > > function() { > > if (!done && (!this.readyState || > > this.readyState == "loaded" || > > this.readyState == "complete")) { > > done = true; > > jqueryHasLoaded(); > > } > > }; > > > head.appendChild(script); > > } > > </script> > > > </head> > > <body> > > <input type="button" onClick="loadjquery()" value="Click to test"/> > > </body> > > </html>
