大佬教程收集整理的这篇文章主要介绍了javascript – jquery ajax:以正确的顺序处理typeahead事件?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用html jquery和java rest-service后端进行webapp.
我有一个带有预先输入建议的文本字段,因此用户在字段中键入的每个字符都是如此
将触发服务器往返并更新预先建议列表.
代码的基本部分:
var showTypeaheadSuggestions = function(data) {
// update ui-element ...
}
var displayFailure = function() {
// update ui-element ...
}
var searchText = $("#searchText");
var searchTextKeyup = function() {
var txt = searchText.val();
$.ajax({
url : typeaheadUrl(txt),type : 'GET',dataType : 'json',}).done(showTypeaheadSuggestions).fail(displayFailurE);
}
searchText.on('keyup',searchTextKeyup);
它基本上是有效的.
但我正在考虑如果你打字会发生什么,例如,2个字母“ab”(这将首先触发“a”的请求,然后是“ab”的请求)…
然后,如果“a”响应需要更长的时间来处理,并在“ab”响应之后到达,会发生什么?
我是否需要在我的代码中检测到这一点,丢掉“a”响应?
在http://api.jquery.com/jquery.ajax/它确实说:
这究竟是什么意思?
我希望这意味着$.ajax()会自动处理上述情况.
但是,当我做一个小测试时(在服务器端,我只是注入了2秒的睡眠延迟,只有当搜索字符串恰好是“a”时),
事实证明它并不像我预期的那样.
预先输入列表将首先使用“ab”响应进行更新,然后在“a”响应时进行更新
到达时,它也会更新,因此预先输入列表会得到错误的建议.
正确处理此问题的既定方法是什么?
var lastrequest;
var searchText = $("#searchText");
function requestClass()
{
var that = this;
this.showTypeaheadSuggestions = function(data) {
//update ui-element
if (lastrequest == that)
console.log('suggestions retrieved: ' + data);
else
console.log('this response (' + data + ') is ignored');
};
this.displayFailure = function() {
//update ui-element
console.log('failure');
};
}
var searchTextKeyup = function() {
var request = new requestClass();
lastrequest = request;
var txt = searchText.val();
$.ajax({
url : typeaheadUrl(txt),}).done(request.showTypeaheadSuggestions).fail(request.displayFailurE);
}
searchText.on('keyup',searchTextKeyup);
我已经使用您在问题中提出的小测试对此进行了测试(当搜索字符串与’a’字符匹配时添加2秒延迟),结果如下:
suggestions retrieved: ab
this response (a) is ignored
以上是大佬教程为你收集整理的javascript – jquery ajax:以正确的顺序处理typeahead事件?全部内容,希望文章能够帮你解决javascript – jquery ajax:以正确的顺序处理typeahead事件?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。