JQuery deferred.state() method

Last Updated : 16 Jul, 2020

This deferred.state() method in JQuery is used to determine the current state of a Deferred object.
Syntax:

deferred.state()

Return Value: This method returns the state of deferred object.

There are two examples discussed below:

Example: In this example, the state of deferred object ‘def’ is pending.

<!DOCTYPE HTML>  
<html>   
<head>  
    <title>  
      JQuery | deferred.state() method 
    </title> 
    <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 id="GFG_UP">  
    </p> 
    <button onclick = "Geeks();"> 
    click here 
    </button> 
    <p id="GFG_DOWN">  
    </p> 
    <script>  
        var el_up = document.getElementById("GFG_UP"); 
        el_up.innerHTML = "JQuery | deferred.state() method"; 
        var def = $.Deferred(); 
        function Geeks() { 
         $('#GFG_DOWN').text('deferred state is ' + def.state()); 
        }  
    </script>  
</body>    
</html> 

Output:

Example: In this example, the state of deferred object ‘def’ is pending and by clicking on the button it changes to resolved.

<!DOCTYPE HTML>  
<html>   
<head>  
    <title>  
      JQuery | deferred.state() method 
    </title> 
    <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 id="GFG_UP">  
    </p> 
    <button onclick = "Geeks();"> 
    click here 
    </button> 
    <p id="GFG_DOWN">  
    </p> 
    <script>  
        var el_up = document.getElementById("GFG_UP"); 
        el_up.innerHTML = "JQuery | deferred.state() method"; 
        var def = $.Deferred(); 
        def.always(Func); 
        $('#GFG_DOWN').append( 
          'Deferred state is ' + def.state() + '</br>'); 
        function Func(val, div){ 
          $(div).append(val); 
        } 
        function Geeks() { 
            def.resolve( 
      'Our deferred is resolved now. <br />', '#GFG_DOWN'); 
            $('#GFG_DOWN').append(  
'Current state of deferred is ' + def.state() + ' <br />'); 
        }  
    </script>  
</body>    
</html> 