jQuery.holdReady()    ** DEPRECATED ** JQ Home  <<  Core & Internals  <<  jQuery.holdReady()

Hold or release the jQuery ready event.

Shorthand version $.holdReady()

Description

The jQuery.holdReady() method holds or releases the execution of the jQuery ready event.

This method was deprecated in jQuery 3.2.

Syntax

Signature Description
jQuery.holdReady( hold )Hold or release the execution of the jQuery ready event.

Parameters

Parameter Description Type
holdA boolean representing whether to hold or release the jQuery ready event

true - Hold the jQuery ready event.

false - Release the jQuery ready event.		Boolean

Return

undefined

jQuery.holdReady( hold ) Example Core  <<  Top

Hold or releases the execution of the jQuery ready event.

jQuery allows us to fire off events as soon as the DOM is ready by using the .ready() method. There are also situations where we may want to delay execution of the jQuery ready event, for example to load plugins. We can then release the jQuery ready event after our conditions are met giving us complete control. We use the jQuery.holdReady() method to achieve this. When using this method its best to ensure its called early within the HTML document and before the ready event has already fired.

A good place to put this method is in the <head></head> HTML element after the import of the jQuery library and before any other JavaScript and jQuery that is to be executed. Calling this method after the ready event has already fired will have no effect.

When you entered this page an alert box was shown informing you that the jQuery ready event is about to fire. When you closed the alert box we released the jQuery ready event. Simplified HTML code is shown below so you can see its placement:


<!DOCTYPE html 
<html lang="en">
<head>
  <title>jQuery Core & Internals</title>
	
  <!-- This is where we import the minified jQuery library -->
  <script type="text/javascript" src="jquery-3.5.1.min.js"></script>

  <!-- Our jQuery to hold and release ready event-->
  <script type="text/javascript">
    $.holdReady(true);
    alert('jQuery ready event being released);
    $.holdReady(false);
    $(function(){ // jQuery(document).ready(function(){
      // Other jQuery stuff for after ready()
    });
  </script>
</head>
<body>
</body>
</html>

All we see on page entry is the alert box as we haven't released the ready event which is the first code in the <head> </head> HTML element after all the imports. Therefore at this point no <body> </body> HTML elements have been rendered to the page.

Related Tutorials

jQuery Basic Tutorials - Lesson 2 - jQuery Core & Internals