Basj Basj - 1 month ago 27
jQuery Question

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?

Answer

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.

Comments