5

誰かが私が次のコードを理解するのを手伝ってもらえますか？ここで見つけました。

リモートソースでJQueryUIオートコンプリートを利用します。私はできる限りコードにコメントしましたが、より正確な質問がそれに続きます。

    $( "#city" ).autocomplete({
        source: function( request, response )  {
//request is an objet which contains the user input so far
// response is a callback expecting an argument with the values to autocomplete with
            $.ajax({
                url: "http://ws.geonames.org/searchJSON", //where is script located 
                dataType: "jsonp", //type of data we send the script
                data: { //what data do we send the script 
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: request.term
                },
                success: function( data ) { //CONFUSED!
                    response( 
                        $.map( 
                        data.geonames, function( item ) { 
                                            return {
                                                    label: item.name+(item.adminName1 ? ","+item.adminName1:"")+","+item.countryName,   
        value: item.name
                                            }
                                        }
                        )
                    );
                  }
            });
        }
    });

ご覧のとおり、success関数と応答コールバックの使用法がわかりません。

成功関数リテラルは、AJAXクエリが返されるときに呼び出されるAJAXオプションであることを知っています。この場合、応答コールバックへの呼び出しをカプセル化しているように見えますか？どちらがどこで定義されていますか？コールバックの定義から、それはそれ自体で呼び出されるべきだと思いましたか？

ありがとう！

4

1 に答える 1

6

responseドキュメント（「概要」ページ）で定義されているオブジェクト：

応答コールバック。単一の引数に、ユーザーに提案するデータが含まれていることを期待します。このデータは、指定された用語に基づいてフィルタリングする必要があり、単純なローカルデータ（ラベル/値/両方のプロパティを持つString-ArrayまたはObject-Array）の場合は上記の任意の形式にすることができます。リクエスト中のエラーを処理するカスタムソースコールバックを提供する場合は重要です。エラーが発生した場合でも、常に応答コールバックを呼び出す必要があります。これにより、ウィジェットが常に正しい状態になります。

したがって、「response」引数は実際にはコールバックであり、オートコンプリートアイテムのajax取得が成功したときに呼び出す必要があります。

データはAJAX経由で返されるため、コードはウィジェットを手動で更新する必要があります。jQueryUIは引数を関数として提供するため、コードは関数を呼び出してその更新を実行できます。

オプションresponseに使用される関数の宣言で定義されたオブジェクトを確認できます。source

source: function( request, response )

方程式からAJAX呼び出しを取り出して、次のようなことを行うこともできます。

source: function(request, response) {
    response([{label:'foo', value: 'foo'},{label:'bar', value:'bar'}]);
}

responseウィジェットのラベル/値のペアの配列を使用して、すぐにコールバックを呼び出します。

于 2010-12-26T02:33:12.790 に答える