0

变量 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 调用）我不想有延迟。

4

3 回答 3

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;
                    }
                }
            });
        }
    }
});​
于 2012-11-29T17:43:54.547 回答
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;
            }
        }
    }
}
于 2012-12-10T16:33:49.177 回答
0

默认情况下，JavaScript 在遇到异步函数时是异步的，它会将该函数排队以备后用。但是，如果您想要暂停 js（ajax 调用或任何东西），您可以使用 Promise 案例 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();
于 2019-01-18T15:59:36.833 回答