JQuery ajaxError()用法及代碼示例

jQuery中的ajaxError()方法用於指定AJAX請求失敗時要運行的函數。

用法:

$(document).ajaxError( function(event, xhr, options, exc) )

參數：：此方法接受強製性的單參數函數。此函數接受以下列出的四個參數：

event:此參數保存事件對象。
xhr:它包含XMLHttpRequest對象。
options:它包含AJAX請求中使用的選項。
exc:它包含JavaScript異常。

demo.txt文件存儲在服務器上，單擊更改內容按鈕後將加載。
demo.txt

This is GFG.

示例1:本示例通過從服務器獲取數據來更改元素的內容。當AJAX請求由於錯誤而失敗時，頁麵會顯示AJAX請求失敗。

<!DOCTYPE html>  
<html>  
    <head>  
        <script src=  
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">  
        </script>  
          
        <!-- Script to use ajaxError() method -->
        <script>  
            $(document).ready(function() { 
                $(document).ajaxError(function() { 
                    alert("AJAX request fails."); 
                }); 
              
                $("button").click(function() { 
                    $("#paragraph").load("demo.txt"); 
                }); 
            }); 
        </script>  
    </head>  
      
    <body style="text-align:center;">  
      
        <div id="div_content">  
          
            <h1 style = "color: green;"> 
                GeeksforGeeks 
            </h1>  
              
            <p id = "paragraph" style= "font-size: 20px;"> 
                A computer science portal for geeks 
            </p>  
        </div>  
          
        <button> 
            Change Content 
        </button>  
    </body>  
</html>

輸出：

在單擊按鈕之前：
單擊按鈕後：

示例2:本示例通過從服務器獲取數據來更改元素的內容。當AJAX請求由於錯誤而失敗時，頁麵會顯示AJAX請求失敗。

<!DOCTYPE html>  
<html>  
    <head>  
        <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">  
        </script>  
          
        <!-- Script to use ajaxError() method -->
        <script>  
            $(document).ready(function() { 
                $(document).ajaxError(function() { 
                    alert("AJAX request fails."); 
                }); 
              
                $("button").click(function() { 
                    $("#heading").load("demo.txt"); 
                }); 
            }); 
        </script>  
    </head>  
      
    <body style="text-align:center;">  
      
        <div id="div_content">  
          
            <h1 id = "heading" style = "color: green;"> 
                GeeksforGeeks 
            </h1>  
              
            <p style= "font-size: 20px;"> 
                A computer science portal for geeks 
            </p>  
        </div>  
          
        <button> 
            Change Content 
        </button>  
    </body>  
</html>

輸出：

在單擊按鈕之前：
單擊按鈕後：

相關用法

注：本文由純淨天空篩選整理自PranchalKatiyar大神的英文原創作品 jQuery | ajaxError() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。