jQuery deferred.fail() Method

Last Updated : 11 Oct, 2021

The deferred.fail() method in jQuery is used to add handlers which are to be called when the Deferred object is rejected. This method accepts one or more than one arguments, which can be either a function or an array of functions. Callbacks are executed in the same order they were added. When the Deferred object is rejected, the failedCallbacks are called.

Syntax:

deferred.fail(failedCallbacks, failedCallbacks )

Parameters:

failedCallbacks: This parameter specifies a function, or an array of functions, which are to be called when the Deferred is rejected.
failedCallbacks: This parameter specifies the optional additional function, or an array of functions, which are to be called when the Deferred is rejected.

Return Value: This method returns the deferred object.

Example 1:

html

<!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 | deferred.fail() method 
    </p> 
  
    <button onclick="Geeks();"> 
        click here 
    </button> 
      
    <script> 
        function Geeks() { 
            $.get("testingGFG.php") 
                .done(function () { 
                    alert("$.get successfully completed!"); 
                }) 
                .fail(function () { 
                    alert("$.get failed!"); 
                }); 
        }  
    </script> 
</body> 
  
</html> 

Output:

Before clicking on button:

After clicking on button:

Example 2:

html

<!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 | deferred.fail() method 
    </p> 
  
    <button onclick="Geeks();"> 
        click here 
    </button> 
  
    <p id="GFG_DOWN"></p> 
  
    <script> 
        var el_down = document.getElementById("GFG_DOWN"); 
        function Geeks() { 
            $.get("testingGFG.php") 
                .done(function () { 
                    el_down.innerHTML =  
                        "$.get successfully completed"; 
                }) 
                .fail(function () { 
                    el_down.innerHTML = "$.get failed!"; 
                }); 
        }  
    </script> 
</body> 
  
</html> 