一、遮罩用途及效果
ShowLoading这个jQuery插件设计用于当运行Ajax请求时,可以在屏幕某一特殊区域(id,class或者body标签)覆一张正在加载中的图片。
有时候我们页面调用后台程序时间比较长时,前台页面暴露在用户之下,如果用户点击可能会造成逻辑混乱。这时候,遮罩就起到了很好的效果,在触发后台程序时我们将前台页面遮住,不让操作,同时给予一个程序运行请等待的效果。
遮罩效果:
二、JQuery遮罩UI实现
引用文件:(下载地址)
showLoading.css
jquery.showLoading.js
可去我主页下载
三、使用方法
//全局显示遮罩
$(“body”).showLoading();
//ajax调用
jQuery('body').showLoading();
$.ajax({
type: "post",
dataType:"json",
url: "/checkIsYes.do",
data:{},
success: function(response){
//取消遮罩
jQuery('body').hideLoading();
window.location.reload()
}
});