我遇到了一些我們所做的jQuery控件的問題。假設你有一個下拉列表,允許你輸入你正在查找的項目的ID,當你按下ENTER或在文本框中失去焦點時,它會通過jQuery驗證你輸入的ID是否正確,如果它沒有顯示警報「T。如何知道jQuery是否有待處理的Ajax請求?
問題是,當一個普通用戶在其中輸入一個無效值,並通過按提交按鈕失去焦點時,在發送表單提交後,jQuery post會返回。
有沒有什麼方法可以檢查是否有任何異步請求由jQuery處理,以便我不允許表單提交?
我遇到了一些我們所做的jQuery控件的問題。假設你有一個下拉列表,允許你輸入你正在查找的項目的ID,當你按下ENTER或在文本框中失去焦點時,它會通過jQuery驗證你輸入的ID是否正確,如果它沒有顯示警報「T。如何知道jQuery是否有待處理的Ajax請求?
問題是,當一個普通用戶在其中輸入一個無效值,並通過按提交按鈕失去焦點時,在發送表單提交後,jQuery post會返回。
有沒有什麼方法可以檢查是否有任何異步請求由jQuery處理,以便我不允許表單提交?
$ .ajax()函數返回一個XMLHttpRequest對象。將其存儲在可從提交按鈕的「OnClick」事件訪問的變量中。當一個提交的點擊處理檢查以查看是否XMLHttpRequest的變量是:
1)空的,這意味着沒有請求已被尚未
2發送),該readyState值爲4(加載)。這意味着該請求已成功發送並返回。
在這兩種情況下,返回true並允許提交繼續。否則,返回false以阻止提交,併爲用戶提供某些爲什麼提交不起作用的指示。 :)
檢查空,以確定是否存在請求對象是很重要的,但如果它不爲空,你應該確實檢查'request.readyState> 0 && request.readyState <4'以確定'活動'請求,因爲readyState 0表示儘管e對象已經創建,Web請求尚未啓動。 – 2010-10-08 17:38:48
$(function() {
function checkPendingRequest() {
if ($.active > 0) {
window.setTimeout(checkPendingRequest, 1000);
//Mostrar peticiones pendientes ejemplo: $("#control").val("Peticiones pendientes" + $.active);
}
else {
alert("No hay peticiones pendientes");
}
};
window.setTimeout(checkPendingRequest, 1000);
});
似乎是一個很好的解決方案,但是,你有沒有發現任何問題的「最大調用堆棧大小」? – Mikel 2017-07-06 06:18:31
這撥弄使用$ .ajax.abort()方法來中止請求,如果它是積極的。它使用readyState屬性來檢查請求是否處於活動狀態。
HTML
<h3>Cancel Ajax Request on Demand</h3>
<div id="test"></div>
<input type="button" id="btnCancel" value="Click to Cancel the Ajax Request" />
JS代碼
//Initial Message
var ajaxRequestVariable;
$("#test").html("Please wait while request is being processed..");
//Event handler for Cancel Button
$("#btnCancel").on("click", function(){
if (ajaxRequestVariable !== undefined)
if (ajaxRequestVariable.readyState > 0 && ajaxRequestVariable.readyState < 4)
{
ajaxRequestVariable.abort();
$("#test").html("Ajax Request Cancelled.");
}
});
//Ajax Process Starts
ajaxRequestVariable = $.ajax({
method: "POST",
url: '/echo/json/',
contentType: "application/json",
cache: false,
dataType: "json",
data: {
json: JSON.encode({
data:
[
{"prop1":"prop1Value"},
{"prop1":"prop2Value"}
]
}),
delay: 11
},
success: function (response) {
$("#test").show();
$("#test").html("Request is completed");
},
error: function (error) {
},
complete: function() {
}
});
這對我更好,因爲我的控件使用HtmlHelper多次渲染。謝謝! – sabanito 2009-11-30 23:43:35