jquery blockUI插件

这个jQuery插件可以为页面上的任意元素添加遮层，阻止用户操做。具体能够用于制做提示等待响应的对话框。当要执行某个较长操做时候，经过 blockUI来阻止当前用户继续操做。

html页面 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>blockUI测试</title> <script type="text/javascript" src="./jquery-1.7.1.min.js"></script> <script type="text/javascript" src="./jquery.blockUI.js"></script> <script type="text/javascript"> $(document).ready(function () {             /*例子1*/             $('#btnOpen').click(function () {                 $.blockUI();                 setTimeout($.unblockUI, 2000);             });             /*例子2*/             $('#btnOpen2').click(function () {                 $.blockUI({                     message:"请稍候",                     css: {                     border: 'none',                     padding: '15px',                     backgroundColor: 'yellow',                     width:"300px",                     opacity: .5,                     color: 'Red'                    }                 });                 setTimeout($.unblockUI, 2000);             });             /*例子3*/             $('#btnOpen3').click(function () {                 $.blockUI({                     message: '<image src="default.jpg"></image>',                     css: {                         border: 'none',                   // 无边界                         width:"20px",                     // 中间框框的宽度                         top:"30%",                        // 高居中                         left:"30%"                        // 左居中                    }                 });                 setTimeout($.unblockUI, 5000);             });             /*例子4*/             $('#btnOpen4').click(function () {                 $.blockUI({                     message: $('#loginForm')                 });             });             $('#btnReset').click(function () {                 $.unblockUI();             });             $('#btnLogin').click(function () {                location.href ="index.html";             });         }); </script> blockUI测试 <form id="form1" runat="server">     <div>         <input id="btnOpen" type="button" value="Open" />     </div> </form> <form id="form2" runat="server">     <div>     <input id="btnOpen2" type="button" value="Open2" />     </div> </form> <form id="form3" runat="server">     <div>         <input id="btnOpen3" type="button" value="Open3"/>     </div>  </form>  <form id="form4" runat="server">     <div>         <input id="btnOpen4" type="button" value="Open4"/>         <div id="loginForm" style="display:none; cursor:default">             <table style="text-align:right">                 <tr>                     <td colspan="2">用户名:<input id="txtUserName" type="text" /></td>                 </tr>                  <tr>                     <td colspan="2">密码:<input id="Text1" type="text" /></td>                 </tr>                 <tr style="text-align:center">                     <td>                         <input id="btnLogin" type="button" value="登录" />                    </td>                     <td>                         <input id="btnReset" type="reset" value="取消登录" />                     </td>                 </tr>             </table>         </div>     </div> </form>