编程 Javascript

jquery实现ajax加载超时提示的方法

Posted in Javascript onJuly 23, 2016

本文实例讲述了jquery实现ajax加载超时提示的方法。分享给大家供大家参考，具体如下：

index.php

<!doctype html>
<html>
  <head>
    <meta charset="utf-8"/>
    <title>加载超时</title>
    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7/jquery.min.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      function load(){
        $("#tips").html("加载中...");
        $.ajax({
          async:true,
          cache:false,
          timeout:8000,
          type:"POST",
          url:"result.php",
          data:{a:'123'},
          error:function(jqXHR, textStatus, errorThrown){
            if(textStatus=="timeout"){
              $("#tips").html("加载超时，请重试");
            }else{
              alert(textStatus);
            }
          },
          success:function(msg){
            $("#tips").html(msg);
          }
        });
      }
    </script>
    <input type="button" id="load" onclick="load();" value="点击加载"/>
    <div id="tips"></div>
  </body>
<html>

result.php

<?php
//sleep(20);
sleep(2);
echo $_POST['a'].'test服务器返回结果';

希望本文所述对大家jQuery程序设计有所帮助。

jquery实现ajax加载超时提示的方法

- Author -

coder

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

javascript动态添加表格数据行(ASP后台数据库保存例子)

May 08 Javascript

关于Ext中form移除textfield方法:hide(),setVisible(false)，remove()

Dec 02 Javascript

解析javascript 实用函数的使用详解

May 10 Javascript

js 编码转换 gb2312 和 utf8 互转的2种方法

Aug 07 Javascript

jQuery知识点整理

Jan 30 Javascript

详解Javascript中的原型OOP

Oct 12 Javascript

JS新包管理工具yarn和npm的对比与使用入门

Dec 09 Javascript

BootStrapTable 单选及取值的实现方法

Jan 10 Javascript

webpack配置打包后图片路径出错的解决

Apr 26 Javascript

PHP实现基于Redis的MessageQueue队列封装操作示例

Feb 02 Javascript

vue实现歌手列表字母排序下拉滚动条侧栏排序实时更新

May 14 Javascript

vue.js Router中嵌套路由的实用示例

Jun 27 Vue.js

数据结构中的各种排序方法小结(JS实现)

Jul 23 #Javascript

js的各种排序算法实现(总结)

Jul 23 #Javascript

js事件驱动机制浏览器兼容处理方法

Jul 23 #Javascript

javaScript事件机制兼容【详细整理】

Jul 23 #Javascript

基于bootstrap实现广告轮播带图片和文字效果

Jul 22 #Javascript

基于Bootstrap实现的下拉菜单手机端不能选择菜单项的原因附解决办法

Jul 22 #Javascript

基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项，一个下拉菜单和登录表单导航条)

Jul 22 #Javascript