Alternative for "$(document).ready" function

Question

I am using fancybox in an aspx page. The document ready function does not work in this page for a lightbox. Someone told me to write a new javascript code for loading the lightbox in that page.

If you want to execute your script when everything is loaded use `$(window).load(function(){ // ...})` — Ram, Sep 11 '12 at 09:15
@undefined, this is almost the same as `$(document).ready(function(){ ... })`. `load()` will wait until the graphics are also loaded. — alexbusu, Sep 11 '12 at 09:19
Why is $(document).ready not working? You do have jQuery included right? — TheNameless, Sep 11 '12 at 09:42

score 47 · Answer 1 · answered Sep 11 '12 at 09:51

47

Include jQuery.
Check network tab that you are not getting 404.
Check console that you are not getting "$ is unknown".

Do stuff when DOM is ready.

$(function(){
   // DOM Ready - do your stuff 
});

answered Sep 11 '12 at 09:51

6

I think he means alternative to jquery load event – Claudiu Dec 20 '13 at 17:15
3

regardless of what the OP meant, I keep revisiting this page via Google (because I seem to forget this nifty convention). Thanks @user338195! – kingPuppy Dec 30 '14 at 19:43

score 42 · Answer 2 · answered Dec 20 '13 at 17:16

42

Try this:

document.addEventListener('DOMContentLoaded', function() {
   // ...
});

Works in modern browers and IE9+

answered Dec 20 '13 at 17:16

Claudiu

3,700
1
38
35

Keep in mind that this won't work if the DOM has already loaded. If that's going to be a problem, take a look at these answers instead: https://stackoverflow.com/q/799981 https://stackoverflow.com/q/9899372 – Pikamander2 Sep 24 '19 at 12:26

score 7 · Answer 3 · answered Sep 11 '12 at 09:18

7

You could use the standard js onload function to run if that's what your'e missing:

window.onload = function() {};

Do note that this might give you issues with libraries - I haven't investigated that.

answered Sep 11 '12 at 09:18

LasseValentini

256
1
3

score 4 · Answer 4 · answered Aug 13 '18 at 21:41

4

I believe using the script defer tag is the best solution. For example,

<script src="demo_defer.js" defer></script>

More information at W3 Schools.

answered Aug 13 '18 at 21:41

remjx

4,104
3
34
32

I actually didn't know about this and I kinda pride myself on knowing the common "unknowns" lol. Thanks! – E10 Sep 23 '21 at 16:55

score 3 · Answer 5 · answered Dec 23 '14 at 12:49

3

best ways is to use like this:

jQuery.noConflict();
(function($) {
  $(function() {
   // by passing the $ you can code using the $ alias for jQuery
   alert('Page: ' + $('title').html() + ' dom loaded!');
  });
})(jQuery);

answered Dec 23 '14 at 12:49

Lonare

3,581
1
41
45

Alternative for "$(document).ready" function

5 Answers5

Linked