• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >AJAX > 巧用ajax请求服务器加载数据列表时提示loading的方法

巧用ajax请求服务器加载数据列表时提示loading的方法

作者: 字体:[增加 减小] 来源:互联网 时间:2017-05-11

通过本文主要向大家介绍了同音巧用的歇后语,借东风 巧用天时,家庭巧种巧用芽苗菜,什么借东风巧用天时,谁借东风巧用天时等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

我们利用weui.js中的weui.loading为效果,ajax的beforeSend与complete方法,做一个加载数据时会有几秒的 loading...

要在页面需要加载的JS文件:

<script src="../js/libs/weui.min.js"></script>

可以去weui的文档中下载,这是它的demo:   https://weui.io/weui.js/

这里主要讲jQuery ajax的get,查询数据时,它的结构为:

$.ajax({
  type: 'get',
  url: url,
  data: data,
  dataType: 'json',
  contentType: 'apllication/json; charset=utf-8' ,
  //数据加载前调用的方法 beforeSend()
  beforeSend: function(data){
   //这里判断,如果没有加载数据,会显示loading    
   if(data.readyState == 0){ 
     weui.loading('loading');   
   }
  },
  //数据加载成功调用的方法 sucess()
  sucess: function(data){
    //这里写数据加载成功后,会执行的代码
  },  
  //数据加载成功后调用的方法  complete()
  complete: function(data){
    //这里判断,数据加载成功之后,loading 隐藏
    if(data.status == 200){
      setTimeOut(function(){
        weui.loading('loading').hide();
      },500);
    }
  },
  //数据加载错误后调用的方法 error()
  error: function(data){
    weui.topTips('数据加载失败!');
  }
})
</div>

以上这篇巧用ajax请求服务器加载数据列表时提示loading的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 巧用ajax请求服务器加载数据列表时提示loading的方法

相关文章

  • 2017-05-11Ajax bootstrap美化网页并实现页面的加载删除与查看详情
  • 2017-05-11基于ajax实现无刷新分页的方法
  • 2017-05-11AJAX实现图片预览与上传及生成缩略图的方法
  • 2017-05-11利用Ajax实现在脚本里传值实例介绍
  • 2017-05-11javascript 拖动_cookie_ajax等
  • 2017-05-11ajax用json实现数据传输
  • 2017-08-26bootstrap table通过ajax获取后台数据展示在table
  • 2017-05-11xajax的FORM例子
  • 2017-05-11ajax给全局变量赋值问题解决示例
  • 2017-05-11Ajax内部交流文档第1/3页

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • ajax视频课件 在线观看地址
    • AJAX简单异步通信实例分析
    • AJAX和WebService实现省市县三级联动具体代码
    • Ajax动态为下拉列表添加数据的实现方法
    • Ajax传Jsond Mvc后台接收实例
    • ajax实现的提交文章前进行敏感词审核的代码
    • Ajax添加数据与删除篇实现代码
    • 十大最佳Ajax教程收集(图文)
    • AJAX XMLHttpRequest对象详解
    • ajax实现登录功能

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有