飞行AJAX请求使用JQuery的.ajax?
可能重复:
使用jQuery使用JavaScript来杀死Ajax请求
以下是我正在使用的简单代码:
$("#friend_search").keyup(function() {
if($(this).val().length > 0) {
obtainFriendlist($(this).val());
} else {
obtainFriendlist("");
}
});
function obtainFriendlist(strseg) {
$.ajax({
type: "GET",
url: "getFriendlist.php",
data: "search="+strseg,
success: function(msg){
UIDisplayFriends(msg);
}
});
}
从本质上讲,如果在函数getsFriendlist返回一个结果(并触发UIDisplayFriends(msg))之前触发了一个keyup事件,我需要取消正在进行的请求。我一直存在的问题是它们建立起来, UIDisplayFriends被重复触发。
非常感谢你,建议也有帮助
$.ajax
的返回值是一个XHR对象,您可以调用它。 要中止该功能,您可以执行如下操作:
var xhr = $.ajax(...)
...
xhr.abort()
增加一些去抖动以减轻服务器的负担也许是明智的。 以下仅在用户停止输入100ms后才会发送XHR呼叫。
var delay = 100,
handle = null;
$("#friend_search").keyup(function() {
var that = this;
clearTimeout(handle);
handle = setTimeout(function() {
if($(that).val().length > 0) {
obtainFriendlist($(that).val());
} else {
obtainFriendlist("");
}
}, delay);
});
你应该真正做的第三件事是根据请求是否仍然有效过滤XHR响应:
var lastXHR, lastStrseg;
function obtainFriendlist(strseg) {
// Kill the last XHR request if it still exists.
lastXHR && lastXHR.abort && lastXHR.abort();
lastStrseg = strseg;
lastXHR = $.ajax({
type: "GET",
url: "getFriendlist.php",
data: "search="+strseg,
success: function(msg){
// Only display friends if the search is the last search.
if(lastStrseg == strseg)
UIDisplayFriends(msg);
}
});
}
如何使用变量(比如isLoading),通过使用.ajax的beforeSend(jqXHR,settings)选项将其设置为true,然后使用完整设置将变量设置为false。 那么在触发另一个Ajax调用之前,您只需对该变量进行验证?
var isLoading = false;
$("#friend_search").keyup(function() {
if (!isLoading) {
if($(this).val().length > 0) {
obtainFriendlist($(this).val());
} else {
obtainFriendlist("");
}
}
});
function obtainFriendlist(strseg) {
$.ajax({
type: "GET",
url: "getFriendlist.php",
beforeSend: function () { isLoading = true; },
data: "search="+strseg,
success: function(msg){
UIDisplayFriends(msg);
},
complete: function() { isLoading = false; }
});
}
链接地址: http://www.djcxy.com/p/71923.html