CODEWITHSUNDEEP
jquery
Jen
Jen

Reputation: 1733

Jquery document ready not firing in 2+, document load not firing

I cannot get a document.load event to fire, and in jQuery 2+, I can't get the document.ready to fire either. How can I make document.ready work in jQuery 2+, and how can I make .load work?
Thanks!

Fiddle: http://jsfiddle.net/2x7SP/2/

    (function($) {
$(document).ready(documentReadyFunction);
$(document).load(afterPageLoad);

function documentReadyFunction() {
  $('#readytext').val('READY');
}

function afterPageLoad () {
  //alert ('loaded');
  $('#loadtext').val('LOAD');
}

})(jQuery);

Upvotes: 1

Views: 93

Answers (3)

Irvin Dominin
Irvin Dominin

Reputation: 30993

The load event is fired by the window, not by document. By changing it, it works fine.

Code:

(function ($) {
    $(document).ready(documentReadyFunction);
    $(window).load(afterPageLoad);

    function documentReadyFunction() {
        $('#readytext').val('READY');
    }

    function afterPageLoad() {
        //alert ('loaded');
        $('#loadtext').val('LOAD');
    }

})(jQuery);

jQuery 2 dropped the support to old IE versions http://blog.jquery.com/2013/04/18/jquery-2-0-released/ :

As promised, this version leaves behind the older Internet Explorer 6, 7, and 8 browsers. In return it is smaller, faster, and can be used in JavaScript environments where the code needed for old-IE compatibility often causes problems of its own. But don’t worry, the jQuery team still supports the 1.x branch which does run on IE 6/7/8. You can (and should) continue to use jQuery 1.9 (and the upcoming 1.10) on web sites that need to accommodate older browsers.

If you need to support IE<9 you have to switch to jQuery 1.x.

Ref: http://jquery.com/browser-support/

Demo: http://jsfiddle.net/IrvinDominin/7CpF7/

Upvotes: 3

Jonathan
Jonathan

Reputation: 9151

This works for me:

function documentReadyFunction() {
    $('#readytext').val('READY');
}

function afterPageLoad() {
    $('#loadtext').val('LOAD');
}

$(document).ready(documentReadyFunction);
$(window).load(afterPageLoad);

Fiddle

Upvotes: 1

Nicklas Nygren
Nicklas Nygren

Reputation: 2605

There are two problems:

  1. There is no such thing as document.load. The load event is only fired by elements associated with a URL, such as an image or an iframe, or the window object, which is probably the one you want to use.
  2. In the fiddle, jQuery is wrapped in the load handler, which means that load has already fired.

The code is fine as long as you replace document.load with window.load:

$(window).load(afterPageLoad);

And don't wrap the jQuery in the load event. Fixed fiddle: http://jsfiddle.net/tNUv2/

Upvotes: 2

Related Questions