jQuery Ajax SyncLock

Question

我有几个按钮,用户可以点击以使用jQuery的$ .ajax加载内容.所有按钮都将内容加载到相同的div标签中.问题是,如果用户快速点击多次,内容可能会在登陆正确的内容之前闪烁几次.

我有什么解决方法？我在想类似.net的SyncLock功能,但在javascript/jQuery中.理想的解决方案是取消队列中当前的请求并启动新的请求.

需要注意的一点是,可能存在多个不相关的ajax请求,因此我无法清除所有请求,只是与这个div标签相关的请求.

Answer 1

清除/取消请求是一项昂贵的任务,所以你真的需要它不要这样做.它也不会停止服务器端的执行,只需关闭httprequest即可.

您应该做的是设置一个"锁定"并相应地锁定和解锁.就像是:

var working = false;

function startAjax() {
    working = true;
    // do ajax and wait for callback()
}

function callback() {
    working = false;
}

在.click()按钮中,确保在实际执行之前检查是否正常工作:

$("#thebutton1, #thebutton2").click(function() {
    if(working) {
        alert("Im in the middle of something");
    } else {
        // execute...
    }
});