jQuery遮罩插件jQuery.blockUI.js简介

概述：

jQuery BlockUI插件可以在不锁定浏览器的同时，模拟同步模式下发起Ajax请求的行为。该插件激活时，会阻止用户在页面进行的操作，直到插件被关闭。BlockUI通过向DOM中添加元素实现其外观和组织用户交互的行为。

使用jQuery BlockUI，首先需要添加插件js源码的引用：

使用方法:

用法很简单，阻止用户对页面的交互(锁定界面)：$.blockUI();

使用自定义信息阻塞UI（解除锁定界面）：$.unblockUI();

若计划使用缺省设置对所有的ajax请求均使用UI遮罩，只需添加下面的语句就可以实现：

$(document).ajaxStart($.blockUI).ajaxStop($.unblockUI);

实际应用举例:

$(".lasy-btn").click(function(){
var verifiyCode = $("input[name='yzm']").val();
$.ezAjax.get({
"url":"${ctx}/service/vfCode/validate.do?vfCode="+verifiyCode+"&seq=001",
success: function (data){
if("succeed"==data.result){
if(validator.form()){
regiserValidateKeyname();
}else{
$.unblockUI();
LG.showError("校验失败，请检查！ ");
}
}else{
$("#btnLogin").attr("disabled", false);
showVfCodeErr("验证码输入错误！");
$("#yzm").focus();
}
},
beforeSend: function ()
{
$.blockUI({
message:"<h1 id=\"waitTip\" style=\"font-size:12px\">正在进行用户注册，请稍后。。。</h1>",
css:{
border: 'none',
padding: '15px',
width:"300px",
cursor:'default',
opacity: 0.5,
"z-index":'99999999999',
background:'black',
color:'#fff'
},
overlayCSS:{
cursor:'default'
}
});
}
});
});

jQuery遮罩插件jQuery.blockUI.js简介相关推荐

Jquery遮罩插件，想罩哪就罩哪！
原文:Jquery遮罩插件,想罩哪就罩哪! 一前言在项目开发时发现没有一个用起来爽一点的遮罩插件,看起来觉得不难好吧那就利用空闲时间,自己折腾一个吧,也好把jquery再温习一下, 需要的功 ...
jQuery分页插件(jquery.page.js)的使用
效果描述: 不用分页即可显示的jQuery插件 jQuery分页插件--jQuery.page.js用法很简单,效果很棒 1.前端首先html的head中引入相关css与js <link re ...
JQuery模板插件jquery.tmpl-动态ajax扩展
在上一篇JQuery模板插件-jquery.tmpl中介绍了这款插件.有时我们需要去动态的ajax去加载模板,或者数据,根据url参数或者其他信息加载不同的模板,数据.在我的某个项目中有这个需求,所以 ...
SlidesJS基本使用方法和官方文档解释【Jquery幻灯片插件 Jquery相册插件】
SlidesJS基本使用方法和官方文档解释 [Jquery幻灯片插件 Jquery相册插件] 标签: jquery文档functionstringdiv相册 2012-04-19 15:23 3931 ...
jquery 滚轮插件 jquery.mousewheel.js
jquery.mousewheel插件使用 jquery中没有鼠标滚轮事件,那么可以使用jquery的滚轮事件插件jquery.mousewheel.js. Github地址:jquery-mouse ...
一款很好用的Jquery 打印插件——jQuery.print.js
https://blog.csdn.net/JodenHe/article/details/70313604?locationNum=3&fps=1 登录网址https://github.co ...
Jquery 模板插件 jquery.tmpl.js 的使用方法(2):嵌套each循环,temp调用(使用预编译的模板缓存)...
直接上代码吧一:主窗口 /*#region SendChooseTargetTemplate 发送候选人主窗口模板*/ var SendChooseTargetTemplate = ''; Send ...
分享一款超棒的jQuery旋钮插件 - jQuery knob
转自:http://www.cnblogs.com/gbin1/archive/2012/05/08/2489908.html 在线演示本地下载如果你也在寻找一款生成漂亮旋钮(knob)的jQu ...
flot - jQuery 图表插件(jquery.flot)使用
Flot是纯Javascript实现的基于jQuery的图表插件,主要支持线状图和柱状图的绘制(通过插件也可以支持饼状图). 它的特点是使用简单.图形美观,支持鼠标跟踪及缩放功能. Flot是基于ca ...

jQuery遮罩插件jQuery.blockUI.js简介

概述：

jQuery遮罩插件jQuery.blockUI.js简介相关推荐

最新文章

热门文章