为 ajax 设置超时（jQuery）

javascript jquery html ajax css

2022-08-30 01:08:28

$.ajax({
    url: "test.html",
    error: function(){
        //do something
    },
    success: function(){
        //do something
    }
});

有时功能工作良好，有时不工作。success

如何为此 ajax 请求设置超时？例如，3 秒，如果时间已过，则显示错误。

问题是，ajax 请求会冻结块直到完成。如果服务器关闭了一小段时间，它将永远不会结束。

答案 1

请阅读文档，这是一个涵盖的主题。$.ajax

$.ajax({
    url: "test.html",
    error: function(){
        // will fire when timeout is reached
    },
    success: function(){
        //do something
    },
    timeout: 3000 // sets timeout to 3 seconds
});

您可以通过访问该选项的 textStatus 参数来查看引发的错误类型。选项包括“超时”、“错误”、“中止”和“解析器”。error: function(jqXHR, textStatus, errorThrown)

答案 2

下面是一些示例，用于演示在 jQuery 的旧范例和新范例中设置和检测超时。

Live Demo

Promise with jQuery 1.8+

Promise.resolve(
  $.ajax({
    url: '/getData',
    timeout:3000 //3 second timeout
  })
).then(function(){
  //do something
}).catch(function(e) {
  if(e.statusText == 'timeout')
  {     
    alert('Native Promise: Failed from timeout'); 
    //do something. Try again perhaps?
  }
});

jQuery 1.8+

$.ajax({
    url: '/getData',
    timeout:3000 //3 second timeout
}).done(function(){
    //do something
}).fail(function(jqXHR, textStatus){
    if(textStatus === 'timeout')
    {     
        alert('Failed from timeout'); 
        //do something. Try again perhaps?
    }
});

jQuery <= 1.7.2

$.ajax({
    url: '/getData',
    error: function(jqXHR, textStatus){
        if(textStatus === 'timeout')
        {     
             alert('Failed from timeout');         
            //do something. Try again perhaps?
        }
    },
    success: function(){
        //do something
    },
    timeout:3000 //3 second timeout
});

请注意，文本Status param（或jqXHR.statusText）将让您知道错误是什么。如果您想知道故障是由超时引起的，这可能很有用。

error（jqXHR， textStatus， errorThrown）

请求失败时要调用的函数。该函数接收三个参数：jqXHR（在 jQuery 1.4.x 中，XMLHttpRequest 中）对象、描述所发生错误类型的字符串和可选异常对象（如果发生）。第二个参数（null 除外）的可能值为“超时”、“错误”、“中止”和“解析器”。发生 HTTP 错误时，errorThrown 会收到 HTTP 状态的文本部分，如“未找到”或“内部服务器错误”。从 jQuery 1.5 开始，错误设置可以接受函数数组。将依次调用每个函数。注意：跨域脚本和 JSONP 请求不调用此处理程序。

来源： http://api.jquery.com/jQuery.ajax/

为 ajax 设置超时 （jQuery）

为 ajax 设置超时（jQuery）