多个ajax请求下等待条显示和隐藏的简单处理
2016-01-19 10:17
344 查看
处理为遇到ajax请求就显示等待条,直到所有的ajax请求执行完毕才关闭等待条。比较简单,源码如下(基于jQuery) //基于jQuery //从第一个ajax请求发出开始显示等待条?直到一系列ajax请求全部结束才关闭等待条。 //任何ajax触发了ajaxSend事件会显示等待框,所有的ajax都执行完成(ajaxComplete事件)才会关闭等待框 $(function(){ //需要监听的ajax的url var listenUrls = [], //等待条选择器 loadingSelector = '.loading-container', //等待条显示需要添加的class loadingClass = 'loading-ajax-active'; $(document).on('ajaxSend',function(){ //显示等待条 if(listenUrls.length <= 0){ $(loadingSelector).addClass(loadingClass); } //添加监听url listenUrls.push(arguments[2].url); }).on('ajaxComplete',function(){ var ajaxUrl = arguments[2].url; for(var i = 0; i < listenUrls.length; i++){ //删除已经完毕的ajax请求监听 if(listenUrls[i] == ajaxUrl){ listenUrls.splice(i,1); } } //没有需要监听的ajax才关闭等待条 if(listenUrls.length <= 0){ $(loadingSelector).removeClass(loadingClass); } }) });
相关文章推荐
- 关于scrollbar-face-color只支持ie的解决办法!
- CSS常用属性之段落
- Function Module for Clearing Accounting Documents (FB05)
- 判断服务运行状态
- Android XListView实现原理讲解及分析
- Android:Moring-早安闹钟开发过程记录(二)
- 轻量级J2EE持久层解决方案,MiniDao-PE版 1.5.4【版本发布】
- doctrine2简要教程
- 北京Uber优步司机奖励政策(1月19日)
- iOS:Xcode中SVN不能提交CocoaPods中的.a文件的解决方法
- my.cnf
- 认识Android中的Fragment
- 数据库设计三大范式简析
- HBase架构
- SSH——Hibernate初学者之旅(四)
- Java堆内存不足
- 2016-01-19linux mount命令
- windows下gvim 中文乱码
- 如何查看crontab的日志记录
- myeclipse每次修改js都需要重新部署问题