jQuery plug-in BlockUI

 

Overview

The jQuery BlockUI Plugin lets you simulate synchronous behavior when using AJAX, without locking the browser[1]. When activated, it will prevent user activity  with  the page (or part of the page) until it is deactivated. BlockUI adds elements to the DOM to give it both the appearance and behavior of blocking user interaction.



Jquery BlockUI 插 件 使你能够在不用锁定浏览器的情况下利用AJAX实现模拟同步。当插件被激活，他将会屏避用户对于页面，或者一部分页面的操作知道他被释放。 BlockUI通过向DOM添加节点的方式，使得页面设计者能够设计出能够将用户超作屏避的界面和超作方式。

Usage is very simple; to block user activity  for  the page:

使用起来非常简单，下面的语句将会屏避用户对当前页面的一切超作：

$.blockUI();

Blocking  with  a custom message:

屏避的时候给用户的提示信息；

$.blockUI( '

 Just a moment...
' );

Blocking  with  custom style.:

利用用户设定的样式屏避用户操作

$.blockUI( { backgroundColor: '#f00', color: '#fff'} );

To unblock the page:

解除页面锁定

$.unblockUI();

If you want to use the  default  settings and have the UI blocked  for  all ajax requests, it's as easy as  this :

如果想在得到所有Ajax请求之后为页面解锁，很简单，可以这样作：

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

[1] Using the XMLHttpRequest object  in  synchronous mode causes the entire browser to lock until the remote call completes. This is usually not a desirable behavior.

[1]在同步模式下使用XMLHTTPRequest对象会引起整个浏览器出于被锁定的状态，直到所有的远程请求完成。而这一现象并不是我们所希望看到的。