jQuery BlockUI插件可以在不锁定浏览器的同时，模拟同步模式下发起Ajax请求的行为。该插件激活时，会阻止用户在页面进行的操作，直到插件被关闭。BlockUI通过向DOM中添加元素实现其外观和组织用户交互的行为。
使用jQuery BlockUI，首先需要添加插件js源码的引用：
<script type="text/javascript" src="http://malsup.github.io/min/jquery.blockUI.min.js"></script>
阻止用户对页面的交互：$.blockUI();
自定义信息阻塞UI：$.blockUI({ message: '<h1><img src="busy.gif" .> Just a moment...</h1>' });
自定义样式阻塞UI：$.blockUI({ css: { backgroundColor: '#f00'; color: '#fff' } });
解除对页面的遮罩：$.unblockUI();
使用缺省设置对所有的ajax请求都使用UI遮罩，添加下面的语句：$(document).ajaxStart($.blockUI).ajaxStop($.unblockUI);
blockUI对页面中的元素进行遮罩，而非遮罩整个页面
$('div.test').block({ message: null });
$('div.test').block({
message: '<h1>Processing</h1>',
css: { border: '3px solid #a00' }
});
$('div.test').unblock();
简单的模态对话框
$.blockUI({ message: $('#question'), css: { width: '275px' } });
<div id="question" style="display:none; cursor: default">
<h1>Would you like to contine?.</h1>
<input type="button" id="yes" value="Yes" />
<input type="button" id="no" value="No" />
</div>
转载自：http://bookshadow.com/weblog/2014/09/26/jquery-blockui-js-introduction/
附：官方DEmo地址：http://malsup.com/jquery/block/#demos
点击遮罩自动关闭
1、$('.blockOverlay').attr('title','Click to unblock').click($.unblockUI);
2、$.blockUI({onOverlayClick: $.unblockUI});
说明：方法1为通用，方法2为回调函数，2.7.0支持。
下载地址：
http://download.csdn.net/download/liuwt999/10133257