如果输入字段的长度为空,我会尝试取消所有剩余的 AJAX 请求。但是,我看到这个错误:
Uncaught TypeError: Cannot read property 'abort' of undefined
$("input#enter").keyup(function() {
if(this.value.length < 1) {
$("#display").empty();
request.abort(); // <--- this line
}else{
var request = $.ajax({
type: "POST",
url: "getdata.php",
data: "title=" + this.value,
success: function(data) {
$("#display").empty();
$("#display").html(data);
}
});
}
});
这是我看到类似示例的地方,他们使用了request.abort()
:Stop all active ajax requests in jQuery
最佳答案
您的问题是由于 request
变量的范围引起的。您需要在处理程序之外声明它:
var request;
$("input#enter").keyup(function() {
var $display = $('#display');
if (this.value.trim().length < 1) {
$display.empty();
request && request.abort();
} else {
request = $.ajax({
type: "POST",
url: "getdata.php",
data: { title: this.value.trim() },
success: function(data) {
$display.html(data);
}
});
}
});
请注意,我稍微修改了 JS 代码,因为如果您要覆盖 html()
,则不需要调用 empty()
。
此外,假设这是一种过滤系统,您可能需要考虑在所有情况下对请求
使用abort()
,就好像新 key 已被使用一样按下后,之前的请求不再与结果相关,可以结束 - 像这样:
var request;
$("input#enter").keyup(function() {
var $display = $('#display');
request && request.abort(); // always abort the previous request, if there was one
if (this.value.trim().length > 0) {
request = $.ajax({
type: "POST",
url: "getdata.php",
data: { title: this.value.trim() },
success: function(data) {
$display.html(data);
}
});
}
});
关于javascript - 无法读取未定义的属性 'abort',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46379652/