📜  如何使用 jQuery 为 ajax 设置超时?

📅  最后修改于: 2021-11-24 05:33:25             🧑  作者: Mango

在 Web 编程中,使用 Ajax 以便将结果数据显示在网页的一部分中,而无需重新加载页面。用户需要执行 Ajax 请求并希望在一个时间范围内得到结果。在这种情况下,代码中使用了 jquery超时功能。会话超时一直是基于 Ajax 的 Web 应用程序中非常常见的特性。

在响应式界面中,程序员需要延迟ajax请求以在响应之前完成一些任务。这可以通过使用 jQuery setTimeout()函数来实现。这个函数在给定的时间后执行给定的 Ajax 代码。

句法 :

  • $.ajax(page_url);
  • $.ajax(page_url,[options]);

参数:

  • page_url:该参数用于提交数据或检索数据。
  • options:该参数用于保存ajax请求所需的其他配置设置。

下面的示例说明了该方法:

示例 1:

  • 代码片段:
    $.ajax({
        url: "test.php",
        error: function(){
            //Error code
        },
        success: function(){
            //Success code
        }
       timeout: 5000 // sets timeout to 5 seconds
    });
    

    如果请求成功,则执行成功函数。或者有时如果发生错误,与其等待更长的时间,不如快速响应。这是在错误函数处理的。下面的程序,解释了代码的ajax部分中超选项的实现。超时是指定要处理请求的时间(以毫秒为单位)的数字。

程序:

  • HTML文件:
    
      
    
      
    
        
        Set timeout for ajax using jQuery
        
      
        
      
        
    
      
    
        

    GeeksforGeeks

         Set timeout for ajax using jQuery     
        
                     
            
           
         
  • PHP文件:以上示例中使用了以下PHP文件。
    
    

输出 :

  • 点击按钮前:

  • 点击按钮后:

示例 2: setTimeout()是一个 jQuery函数,它在延迟特定时间限制后执行代码片段。例如,为访问某个网站的用户延迟特定时间限制的弹出窗口。这个方法接受一个指向函数的指针作为它的第一个参数。在此示例中,使用setTimeout()方法将 Ajax 代码延迟 4 秒。

代码片段:

  • function callerFunction(){
      alert("jQuery setTimeOut execution is fine!");
    }
    setTimeout(callerFunction, 4000);

    或者

  • var callerFunction = function(){
      alert("Execution point!");
    };
    setTimeout(callerFunction, 4000);

程序:

  • HTML文件:
    
    
      
    
        
        Set timeout for ajax using jQuery
        
        
        
    
      
    
        

    GeeksforGeeks

        Set timeout for ajax using jQuery     
        
                     
            
        
      
  • PHP文件:对于上述示例代码,请使用以下PHP文件。
    
    

    输出:

    • 点击按钮前:

    • 点击按钮后:

    取消超时:有时程序员需要使用jQuery clearTimeout()方法取消代码中设置的定时器。

    • 代码片段:
      var timerValue = setTimeout(timerFunction, 5000);
      clearTimeout(timerValue);
      

    jQuery 是一个开源 JavaScript 库,它简化了 HTML/CSS 文档之间的交互,它以其“少写,多做”的理念而广为人知。
    您可以按照此 jQuery 教程和 jQuery 示例从头开始学习 jQuery。