document.on('load') is not firing in jQuery

Question

Here is my code:

$(document).on('load', function(){
    $("html").removeClass("wf-loading");
    $("body").css("opacity", 1);
    console.log('Load Triggered');
});

I have tried putting this code inside and outside $(document).ready() block but that doesn't change anything.

Please provide a **runnable** [mcve] that reproduces problem — charlietfl, Dec 07 '17 at 17:50

Barmar · Answer 1 · 2017-12-07T19:22:03.133

2

The load event fires on the window object, not document.

$(window).on('load', function() {
    ...
})

It doesn't matter whether you put this inside $(document).ready(). The window object is created before running any Javascript.

edited Dec 07 '17 at 19:22

answered Dec 07 '17 at 17:51

Barmar

1

ready happens after the load event? the ready being once the dom has been created, and the load event happening after all resources (images and such) are loaded? i feel like you got that backwards – Taplar Dec 07 '17 at 17:55
Thanks Barmar, it is firing now. That was a silly mistake. I always thought `document` and `window` are interchangeable in these situations. :) – Vineet Sharma Dec 07 '17 at 17:56
okay I rolled back my edit because I understand what you were trying to say about the ready, but it is confusing.... – epascarello Dec 07 '17 at 18:01
@epascarello Turns out I misread https://stackoverflow.com/a/3698214/1491895 so I was wrong about the order. – Barmar Dec 07 '17 at 19:22

1 Answers1