jquery.blockUI.js上传滚动等待效果实现思路及代码


Posted in Javascript onMarch 18, 2013

请求的url:

function request(url, onSuccess, paras, method, isAsync, isMask) { 
$.ajax({type:method,url:url,async:isAsync,data:paras,success:function(request){onSuccess(request,isMask);},error:function(e) {if(isMask) 
$('#div_mask').unblock();},beforeSend:function(e){if(isMask)$('#div_mask').block({message:'<img src="/ets/image/common/loadingCHS.gif"/>'});}}); 
}

ajax 中同步或者异步请求url时,当要响应返回的请求,这是有个等待过程的。
success:function(request){onSuccess(request,isMask);},error:function(e) {if(isMask)$('#div_mask').unblock();},beforeSend:function(e){if(isMask) 
$('#div_mask').block({message:'<img src="/ets/image/common/loadingCHS.gif"/>'});}

1、在这里success后面的是在成功返回响应后去掉的方法({onSuccess)。
2、error是错误的时候去调的方法(error:function(e) {if(isMask)$('#div_mask').unblock();})。unblock()是jquery.blockUI.js的方法,当出错的时候关掉滚动。
3、在后面beforeSend是在响应的时候发送数据,开始去调用的方法$('#div_mask').block({message:'<img src="/ets/image/common/loadingCHS.gif"/>'},
block是jquery.blockUI.js的方法,打开div进行滚动。
效果图:
jquery.blockUI.js上传滚动等待效果实现思路及代码
Javascript 相关文章推荐
动态调用css文件——jquery的应用
Feb 20 Javascript
jquer之ajaxQueue简单实现代码
Sep 15 Javascript
js仿百度有啊通栏展示效果实现代码
May 28 Javascript
jQuery学习笔记之jQuery动画效果
Sep 09 Javascript
JavaScript设计模式之单例模式实例
Sep 24 Javascript
解析JavaScript模仿块级作用域
Dec 29 Javascript
jQuery插件zTree实现的多选树效果示例
Mar 08 Javascript
详解Vue 2.0封装axios笔记
Jun 22 Javascript
JS库之Three.js 简易入门教程(详解之一)
Sep 13 Javascript
Angular简单验证功能示例
Dec 22 Javascript
axios发送post请求,提交图片类型表单数据方法
Mar 16 Javascript
如何在vue中使用kindeditor富文本编辑器
Dec 19 Vue.js
jQuery用unbind方法去掉hover事件及其他方法介绍
Mar 18 #Javascript
JQuery的read函数与js的onload不同方式实现
Mar 18 #Javascript
js前台分页显示后端JAVA数据响应
Mar 18 #Javascript
侧栏跟随滚动的简单实现代码
Mar 18 #Javascript
JS特权方法定义作用以及与公有方法的区别
Mar 18 #Javascript
Javascript判断对象是否相等实现代码
Mar 18 #Javascript
jQuery+css实现图片滚动效果(附源码)
Mar 18 #Javascript
You might like
laravel框架分组控制器和分组路由实现方法示例
2020/01/25 PHP
js判断输入是否为正整数、浮点数等数字的函数代码
2010/11/17 Javascript
JavaScript高级程序设计 阅读笔记(二十) js错误处理
2012/08/14 Javascript
《JavaScript函数式编程》读后感
2015/08/07 Javascript
浅析Bootstrap缩略图组件与警示框组件
2016/04/29 Javascript
fullpage.js全屏滚动插件使用实例
2016/09/06 Javascript
ExtJS 4.2 Grid组件单元格合并的方法
2016/10/12 Javascript
React实现点击删除列表中对应项
2017/01/10 Javascript
基于Vue实现拖拽功能
2020/07/29 Javascript
javaScript强制保留两位小数的输入数校验和小数保留问题
2018/05/09 Javascript
Node.JS枚举统计当前文件夹和子目录下所有代码文件行数
2019/08/23 Javascript
[01:14:05]《加油DOTA》第四期
2014/08/25 DOTA
python发布模块的步骤分享
2014/02/21 Python
Python之reload流程实例代码解析
2018/01/29 Python
python通过伪装头部数据抵抗反爬虫的实例
2018/05/07 Python
dataframe 按条件替换某一列中的值方法
2019/01/29 Python
Python XlsxWriter模块Chart类用法实例分析
2019/03/11 Python
Python使用pandas和xlsxwriter读写xlsx文件的方法示例
2019/04/09 Python
python中如何使用insert函数
2020/01/09 Python
Python图像处理库PIL中图像格式转换的实现
2020/02/26 Python
python opencv进行图像拼接
2020/03/27 Python
Python操作MySQL数据库的示例代码
2020/07/13 Python
python中pathlib模块的基本用法与总结
2020/08/17 Python
解决python3输入的坑——input()
2020/12/05 Python
Python实现Excel自动分组合并单元格
2021/02/22 Python
CSS3实现复选框动画特效示例代码
2016/09/27 HTML / CSS
诚实守信演讲稿
2014/09/01 职场文书
2014预备党员批评与自我批评思想汇报
2014/09/20 职场文书
1000字打架检讨书
2014/11/03 职场文书
家庭财产分割协议书范本
2014/11/24 职场文书
2015年银行工作总结范文
2015/04/01 职场文书
培训班通知
2015/04/25 职场文书
送达通知书
2015/04/25 职场文书
PyQt5结合QtDesigner实现文本框读写操作
2021/06/11 Python
Redis基本数据类型String常用操作命令
2022/06/01 Redis
css弧边选项卡的项目实践
2023/05/07 HTML / CSS