变量ajaxdata在成功函数中被修改,如果尚未完成,我想等待2秒,然后在没有它的情况下继续。
用例适用于jqueryui自动完成字段。自动完成源是一个ajax请求,但如果用户快速键入,并在列表加载之前退出该字段,则该字段将保持未设置状态。在自动完成上使用“更改”事件,我检查用户是否输入了有效选项而未选择它,但如果在更改事件触发时未加载源,则此操作无效。所以如果源(存储在变量'ajaxdata'中)为空,我想在更改函数中延迟等待。
代码:
input.autocomplete({
source: function (request, response){
$.ajax(
{
type: "GET",
url: "/some/url",
dataType: "json",
success: function(data){
response($.map(data,function(item){
return{
label: item.label,
value: item.value
}
}));
ajaxdata = data;
}
}
);
// ajaxopts = ajaxsource(request,response,ajaxurl,xtraqry)
},
change: function(event, ui) {
if (!ui.item) {
// user didn't select an option, but what they typed may still match
var enteredString = $(this).val();
var stringMatch = false;
if (ajaxdata.length==0){
/// THIS IS WHERE I NEED A 2 SECOND DELAY
}
var opts = ajaxdata;
for (var i=0; i < opts.length; i++){
if(opts[i].label.toLowerCase() == enteredString.toLowerCase()){
$(this).val(opts[i].label);// corrects any incorrect case
stringMatch = true;
break;
}
}
}
},
});
编辑:
更具体地说明问题:这种延迟需要有条件。这意味着如果数据已经加载(因为它来自静态源,或来自早期的ajax调用),我不希望有延迟。
答案 0 :(得分:0)
我不确定你要做的是什么,但我很确定这样的事情会更好:
input.autocomplete({
source: function(request, response) {
return $.ajax({
type: "GET",
url: "/some/url",
dataType: "json"
});
},
change: function(event, ui) {
if (!ui.item) {
// user didn't select an option, but what they typed may still match
var enteredString = this.value;
var stringMatch = false;
//make sure ajax is complete
this.source().done(function(data) {
var opts = $.map(data, function(item) {
return {
label: item.label,
value: item.value
}
});
for (var i = 0; i < opts.length; i++) {
if (opts[i].label.toLowerCase() == enteredString.toLowerCase()) {
$(this).val(opts[i].label); // corrects any incorrect case
stringMatch = true;
}
}
});
}
}
});
答案 1 :(得分:0)
如果我正确理解你,我想你只想检查一下是否填充了ajaxdata
;但如果没有,只需等待两秒钟,然后再进行,不用它。
试试这个:
change: function(event, ui) {
if (!ui.item) {
// user didn't select an option, but what they typed may still match
if (ajaxdata.length==0){
/// THIS IS WHERE I NEED A 2 SECOND DELAY
//pass in 'this' so that you can use it
setTimeout(function() {correctCase(this);}, 2000);
}
}
}
。 。 。 。 。
function correctCase(inThis){
//I'm not sure what this variable does. do you really need it???
var stringMatch = false;
var enteredString = $(inThis).val();
//you still want to be sure that ajaxdata is not empty here
if (ajaxdata.length==0){
var opts = ajaxdata;
for (var i=0; i < opts.length; i++){
if(opts[i].label.toLowerCase() == enteredString.toLowerCase()){
$(inThis).val(opts[i].label); // corrects any incorrect case
stringMatch = true; //this variable doesn't seem to do anything after this???
break;
}
}
}
}
答案 2 :(得分:0)
默认情况下,每当JavaScript遇到异步函数时,它都是异步的,它将对该函数排队以便稍后使用。 但是,如果您想暂停js(ajax调用或其他操作),则可以使用promises 情况1:输出hello(将不等待setTimeout) https://jsfiddle.net/shashankgpt270/h0vr53qy/
//async
function myFunction() {
let result1='hello'
//promise =new Promise((resolve,reject)=>{
setTimeout(function(){
resolve("done");
result1="done1";
}, 3000);
//});
//result = await promise
alert(result1);
}
myFunction();
情况2:输出done1(将等待setTimeout) https://jsfiddle.net/shashankgpt270/1o79fudt/
async function myFunction() {
let result1='hello'
promise =new Promise((resolve,reject)=>{
setTimeout(function(){
resolve("done");
result1="done1";
}, 3000);
});
result = await promise
alert(result1);
}
myFunction();