jQuery ajaxError()方法

jQuery中的ajaxError()方法是用来指定AJAX请求失败时要运行的函数。

语法:

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

参数： 。该方法接受单参数函数，这是强制性的。这个函数接受四个参数，如下所示。

event。该参数持有事件对象。
xhr：它持有XMLHttpRequest对象。
options。它包含AJAX请求中使用的选项。
exc:它持有JavaScript的异常。

演示.txt文件存储在服务器上，点击改变内容按钮后，它将被加载。
demo.txt

This is GFG.

例子1：这个例子改变了的内容。 <p>元素，通过从服务器获取数据。当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：这个例子改变了的内容。 <h1>元素，通过从服务器获取数据。当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>