Search code examples
javascriptjquerywordpressdocument-readyready

Two definitions of jQuery ready


I'm trying to debug a strange behaviour on a Wordpress site: the code inside the first occurence of ready seems not to happen. Because of several plugins installed, I see this in code:

<script type="text/javascript">
jQuery(document).ready(function(){   (function() {   ... })();});
</script>

Then later, nearly at the end of the page I see:

<script type="text/javascript">
jQuery(document).on('ready post-load', easy_fancybox_handler );
</script>

Does one definition or "ready" override the other or will both actions happen?


Solution

  • As documented,

    When multiple functions are added via successive calls to this method, they run when the DOM is ready in the order in which they are added.

    So setting a ready handler twice is fine.

    However:

    • The first one is missing a trailing }) and should be a syntax error (which is probably why it does not execute).

    • The second one uses the jQuery(document).on('ready') overload, which is deprecated:

      There is also $(document).on( "ready", handler ), deprecated as of jQuery 1.8 and removed in jQuery 3.0. Note that if the DOM becomes ready before this event is attached, the handler will not be executed.