在网站应用程序中，使用同步方法执行一些长时间的任务时可能阻塞浏览器的UI进程（例如笔者的Chrome54.0.2840.71 m (64-bit)）。此时，需要使用异步处理技术，调用长时间的任务后马上返回，以便继续浏览器的UI进程。特别需要注意的是，异步执行任务返回后，必须保证操作操作者不能做有损该任务的其它操作（例如重复点某些按钮等）。
jQuery的延迟对象Deferred提供了一个较好的异步处理模型，见如下代码：
<!DOCTYPE html>
<head>
<script type="text/javascript" src="jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#btnWait").click(function()
{
CallAsync();
});
});
function Task(count) // 长时间的任务
{
for(var k = 1; k <= count; k++)
{
var x = Math.sqrt(2017) * Math.sqrt(2016);
}
}
function CallAsync()
{
var div = "<div id='waitPanel' style='position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: silver; opacity: 0.05'></div>";
$(document.body).append(div); // 以div块隔离网页与操作者
$(document.body).css("cursor", "wait"); // 显示一个wait光标
var observer = $.Deferred(function(defObj) // 获取一个延迟对象
{
setTimeout(function()
{
Task(999999999);
defObj.resolve(); // 任务结束后发送一个done事件通知
}, 100); // 100毫秒后执行长时间的任务
});
observer.done(function() // 给延迟对象订阅一个done事件
{
$("#waitPanel").remove();
$(document.body).css("cursor", "");
alert("async task done.");
});
}
</script>
</head>
<body>
<input id="btnWait" type="button" value="WaitCursor" />
</body>
</html> 代码中的jQuery版本只需要1.5.0及以后版本即可。