JQuery when() method

0 0 1 minute read

This JQuery.when() method in JQuery gives a way to execute callback functions depending on zero or more Thenable objects, which usually are Deferred objects that represent asynchronous events.

Syntax:

jQuery.when(deferreds)

Parameters:

deferreds: This parameter specifies zero or more Thenable objects.

Return Value: This method returns a Promise.

There are two examples discussed below:

Example: In this example, the Deferred() is used to create a new object and after that then() method is called with notify and resolve method.

<!DOCTYPE HTML>  
<html>   
<head> 
    <script src="https://code.jquery.com/jquery-3.5.0.js"> 
</script>  
</head>    
<body style="text-align:center;"> 
    <h1 style="color:green;">   
        GeeksForGeeks   
    </h1>  
    <p> 
    JQuery.when() method 
    </p> 
    <button onclick = "Geeks();"> 
    click here 
    </button> 
    <p id="GFG_DOWN">  
    </p> 
    <script> 
        var def = $.Deferred(); 
        function Geeks() { 
            $.when().then(function(a) { 
            alert( 
            "when() method called this alert()." ); 
            }); 
        }  
    </script>  
</body>    
</html>         

Output:
Before clicking on button:

After clicking on button:

Example: In this example, the Deferred() method is used and the state of Deferred object is checked.

<!DOCTYPE HTML>  
<html>   
<head> 
    <script src="https://code.jquery.com/jquery-3.5.0.js"> 
</script>  
</head>    
<body style="text-align:center;"> 
    <h1 style="color:green;">   
        GeeksForGeeks   
    </h1>  
    <p> 
    JQuery.when() method  
    </p> 
    <button onclick = "Geeks();"> 
    click here 
    </button> 
    <p id="GFG_DOWN">  
    </p> 
    <script> 
        var def = $.Deferred(); 
        function Geeks() { 
            $.when(def).done(function (x) { 
                $('#GFG_DOWN').append( 
                 'when() method is executed.') 
            }); 
            def.resolve(); 
        }  
    </script>  
</body>    
</html>                 

Output:

Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, zambiatek Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!