0

input次のようなidwordと jQuery 関数を持つ値があります。

$(function() {
var availableTags = ["register", "malloc", "device", "apre", "fallo"];
$("#word").autocomplete({
source: availableTags
});
});

入力にテキストを入力すると、jQuery 関数が呼び出され、結果が表示されます。以下に例を示します。

http://i.imgur.com/cUu97f1.png

「al」と入力すると、これらの文字を含むすべての単語 (配列内) が表示されます。ここでは問題ありませんが、私の問題は次のとおりです。textarea結果をリストとしてではなく、に表示したい。

これは、mallocandfalloがテキストエリア内になければならないことを意味します。

何か提案はありますか？ここで完全なコードのフィドルを見つけることができます。

4

2 に答える 2

1

これは、オートコンプリート メニュー項目を非表示にし、返された項目でテキストエリアを更新するフィドルです。オートコンプリート ウィジェットを壊さないように、メニューはまだそこにあり、非表示になっていることに注意してください。アイデアは、ウィジェットの応答メソッドを使用して、テキストエリアに適切な値をロードすることです。これにより、ページ上のすべてのオートコンプリート メニューが非表示になり、ユーザーが入力内のすべての tet をクリアしてもテキスト ボックスはクリアされないことに注意してください。

オートコンプリート メニュー項目を非表示にする CSS:

.ui-autocomplete li { display: none; }

テキストエリアの応答を取得するための追加コード:

$( "#word" ).autocomplete({
            source: availableTags,
            response: function( event, ui ) {
                $("#testo").val(ui.content.map(function(d) { 
                    return d.label; 
                }).join("\n"));
            }
        });
于 2013-11-14T20:12:16.853 に答える