0

こんにちは、みんな、

私のアプリケーションでは、オートコンプリートを使用しています。次のリストがあります

        <p>
            <input type="text" id="searchField" placeholder="Categories">
            <ul id="suggestions" data-role="listview" data-inset="true"></ul>
        </p>

myArray という名前の配列が 1 つあり、オートコンプリートを次のように使用しています。

$("#searchField").autocomplete(
                        {
                            target: $('#suggestions'),
                            source: myArray ,
                            link: 'target.html?term=',
                            minLength:0
                        });

ここで、クリックしたリスト項目名を取得し、その変数を target.html ファイルで使用したいと考えています。それを取得する方法は？前もって感謝します。

4

4 に答える 4

2

彼らのヘルプドキュメントから。

折り返し電話

オプションのコールバック関数 autoComplete を使用すると、コールバック内にあるコードのみが実行されます。クリック イベント オブジェクトは、選択範囲に含まれる情報へのアクセスに使用するために、コールバック関数に渡されます。1 つの使用例を次に示します。

$("#searchField").autocomplete("update", {
    source: [ "foo", "bar", "baz" ],
    minLength: 3,
    callback: function(e) {
        var $a = $(e.currentTarget); // access the selected item
        $('#searchField').val($a.text()); // place the value of the selection into the search box
        $("#searchField").autocomplete('clear'); // clear the listview
    }
});

オプション 1 このセクションでは、テキスト フィールドにアクセスできます

$('#searchField').val($a.text()); // or $a.value()

コールバックイベント内でこのようなことをしてください

window.location.replace("http://stackoverflow.com?target=" + $a.text());

オプション 2 結果セットがこの形式 (テキストと値) であることを期待しているようです。そのため、他の値が必要な場合は、jquery オートコンプリート (このコンポーネントが基づいている) に頼る必要があります。

 $('#some_id').autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: 'some_url',
                        dataType: "json",
                        data: {
                            filter: request.term
                        },
                        success: function (data) {
                            response($.map(eval(data), function (item) {
                                return {
                                    label: item.Text,
                                    value: item.Value,
                                    extra_value: item.Extra_Value
                                }
                            }));
                        }
                    })
                },
                maxLength: 2,
                select: function (event, ui) {
                    $("#Some_id2").attr('value', ui.item.extra_value);
                }
            });

UPDATE aka OPTION 3 デモコードから、テキスト値だけが必要で、(あなたの場合のように) ID が必要ない場合は、ソース形式を変更するだけです。サーバーから JSON の結果を返すのではなく、文字列の配列を返すか、JSON の結果を文字列配列に変換します。

(デモページの作業サンプルのコード)

var availableTags = ['24', 'about me',... , 'XUIJS'];

    $("#searchField").autocomplete({
        target: $('#suggestions'),
        source: availableTags,
        link: 'target.html?term=',
        minLength: 1,
        matchFromStart: false
    });
于 2012-07-04T06:44:28.137 に答える
0

Callback を使用します。

$("#searchField").autocomplete(
                        {
                            target: $('#suggestions'),
                            source: myArray ,
                            link: 'javascript:void();',
                            minLength:0,
                            callback: function(e){

                                var name = $(e.target).attr('name');
           //This function will be called when one of the suggestions is clicked according to documentation
                                window.location = 'target.html?term='  // This line might need some tweaking. 
                            }
                        });

コードはテストされていません。このコードを段階的にデバッグする必要がある場合があります。

于 2012-07-04T06:02:38.360 に答える
0 
$("#searchField").autocomplete(
                        {
                            icon: 'arrow-l', 
                            target: $('#suggestions'),
                            source: stockArray,
                            link: 'target.html?term=',
                            minLength:0,
                            callback: function(e)
                            {

                                var $a = $(e.currentTarget); // access the selected item
                                console.log("###################!!###"+$a.text());
                                $('#searchField').val($a.text()); // place the value of the selection into the search box
                                $("#searchField").autocomplete('clear'); // clear the listview
                            }


                        });

$a.text() を使用して、選択したアイテムの値を取得します。

于 2012-07-04T11:38:39.977 に答える
0

私が使用する場合

$("#searchField").autocomplete(
                        {
                            icon: 'arrow-l', 
                            target: $('#suggestions'),
                            source: stockArray,
                            link: 'target.html?term=',
                            minLength:0,
                            callback: function(e)
                            {

                                var nameq = $(e.currentTarget); 
                                console.log("^^^^^^^^^^^^^^^^^^^^^"+nameq);
                                //This function will be called when one of the suggestions is clicked according to documentation
                                window.location = 'target.html?term='  
                            }

                        });

nameq の値を次のように取得します

^^^^^^^^^^^^^^^^^^^^^[object Object] at file:///android_asset/www/index.html:115

そして私が使用する場合

$("#searchField").autocomplete(
                        {
                            icon: 'arrow-l', 
                            target: $('#suggestions'),
                            source: stockArray,
                            link: 'target.html?term=',
                            minLength:0,
                            callback: function(e){

                             var nameq = $(e.target).attr('name');

                             console.log("^^^^^^^^^^^^^^^^^^^^^^^^^^"+nameq);
                            //This function will be called when one of the suggestions is clicked according to documentation
                            window.location = 'target.html?term='  // This line might need some tweaking. 
                        }

nameq の値を次のように取得します。

^^^^^^^^^^^^^^^^^^^^^^^^^^undefined at file:///android_asset/www/index.html:115
于 2012-07-04T09:39:36.020 に答える