0

変数 ajaxdata は、success 関数内で変更されます。まだ変更されていない場合は、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は が入力されているかどうかを確認したいだけだと思います。しかし、そうでない場合は、さらに 2 秒待ってから、それなしで続行してください。

これを試して:

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 に答える