Jquery利用ShowLoading组件实现ajax加载前遮罩效果

一、遮罩用途及效果
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()
          }  
      }); 
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值