9

jQuery オートコンプリート UI - 検索を「オンフォーカス」で開始し、ユーザーが何も入力しなくても、ユーザーが検索フィールドをタブまたはクリックしたときに、すぐに選択肢のリストを表示したいと考えています。

デフォルトの動作では、必要な文字数をゼロに設定した場合でも、ユーザーが文字または下向き矢印を入力してボールの転がりを開始し、検索を開始して値を取得する必要があるようです。

$( "#contact" ).autocomplete({
    ソース: 'remote.php',
    最小の長さ: 0
});

ありがとう！

4

7 に答える 7

13

エメットの答えよりも少し複雑ですが...

  • ボックスに既にテキストが含まれている場合でも、フォーカス時にリストをポップアップ表示します
  • アイテムをクリックした後のリストの再ポップアップを回避

ここにあります：

var closing = false;

$('#contact').autocomplete({
    source: 'remote.php',
    minLength: 0,
    close: function()
    {
        // avoid double-pop-up issue
        closing = true;
        setTimeout(function() { closing = false; }, 300);
    }
})
.focus(function() {
    if (!closing)
        $(this).autocomplete("search");
});
于 2011-09-17T11:04:01.327 に答える
7

このコードは少しすっきりしていて、要素固有であることがわかりました。

 $(<selector>).autocomplete({
            minLength: 0,
            delay: 500,
            source: funcDataLookUp,
            open: function() { $(this).attr('state', 'open'); },
            close: function () { $(this).attr('state', 'closed'); }
        }).focus(function () {
            if ($(this).attr('state') != 'open') {
                $(this).autocomplete("search");
            }
        });
于 2013-03-28T14:32:40.937 に答える
5

focusをオートコンプリートにバインドしてみてください。

$("#contact").autocomplete({
        source: 'remote.php',
        minLength: 0
    }).bind('focus', function () {
        $(this).autocomplete("search");
    });

私のサンプルJSFiddleをチェックしてください。

于 2013-07-08T04:32:33.407 に答える
4

目的の結果を選択すると、オートコンプリートの結果ボックスがもう一度ポップアップするため、このソリューションは私にとってはうまくいきませんでした。これは、.focusメソッドがclose:イベントの前に実行されたためです。

さらに、その回答のコードによると、ボックスが閉じられると、closing変数が後に実行されたtrueために残ったため、ボックスは元に戻りません。close:.focus

次のコードは、これら 2 つの問題を解決しました (イベントで変数closingが false に設定されていることに注意してください)。close:

var closing = false;

$(function() {$(".autocomplete").autocomplete({
    source: 'remote.php',
    minLength: 0,
    open: function(){
        closing=true; },
    close: function(){
        closing = false;
        }
})
    .focus(function(){
        if ((!closing) && ($(this).val() !== "")){
            $(this).autocomplete("search");
        }
    });
})
于 2012-01-26T07:48:59.513 に答える
3 
$("#contact").focus(function() {
    if ($(this).val().length == 0) {
        $(this).autocomplete("search");
    }
});

minLengthオートコンプリートが0であることを確認してください。

于 2010-12-18T19:15:58.850 に答える
3

この解決策は私にとってはうまくいきませんが、これは:

$('#contact').autocomplete({
source: 'remote.php',
minLength: 0
           }).focus(function(){
if (this.value == "")
$(this).trigger('keydown.autocomplete');
});

うまく機能します（ソース：jqueryフォーラム）

于 2011-11-10T12:30:17.930 に答える
2

JQUERYは実際にこの方法を提案しています

http://api.jqueryui.com/autocomplete/#method-search

$('.yourclass').autocomplete({
   minLength: 0
   ,source:['blah','andblahagain']
   ,focus: function() {
     $(this).autocomplete("search", "");
   },
});

基本的に、minLength:0 とフォーカス イベントを使用して "" を検索します。

于 2014-07-11T20:55:58.270 に答える