7

こんにちは、Twitter のブートストラップで typeahead を使用しています。ここで見つけたのは、オートコンプリート ドロップダウンで、デフォルトで最初のオプションが選択されることです。私の要件は、最初は何も選択されていないことです。ナビゲーションキー（上または下）を押すか、その上にカーソルを置いたときにのみ最初のオプションに移動します。先行入力を使用することは可能ですか。

4

7 に答える 7

7

デフォルトで先行入力オプションによる選択を避けるために、公式ドキュメントに記載されているパラメータautoSelectを使用しました。デフォルトでは「true」に設定されています

私のコード:

$('#searchString', this.el).typeahead({
        source: function (query, process) {
            var q = '/autocompleteSearch?searchString=' + query;               

            return $.get(q, function (data) {
                return process(data);
            });
        },
        minLength: 3,
        autoSelect: false
    });
于 2015-08-27T18:07:47.180 に答える
2

これを実現するには、ブートストラップの先行入力レンダリング メソッドをオーバーライドするだけです。items.first().addClass('active')元の typehead プラグインの行は、このオーバーライドで削除されます。

$.fn.typeahead.Constructor.prototype.render = function(items) {
     var that = this

     items = $(items).map(function (i, item) {
       i = $(that.options.item).attr('data-value', item)
       i.find('a').html(that.highlighter(item))
       return i[0]
     })

     this.$menu.html(items)
     return this
};
于 2013-11-27T07:03:33.083 に答える
2

この問題のない、より強力な先行入力プロジェクトが Twitter から提供されています。このプロジェクトが Twitter Bootstrap に直接含まれていない理由がわかりません。

ここでいくつかの例を見ることができます。

于 2013-05-06T12:55:03.187 に答える
1

あなたが尋ねるものとは正確には異なりますが、ここに良い回避策があります。基本的に、ユーザーが挿入するテキストを最初の先行入力候補にします。リンクされた回答が言及しているように、これは Chrome のアドレス バーから得られるのと同じ動作です。

于 2013-01-18T10:21:28.227 に答える
0

これを最初に追加することで機能する解決策を見つけました：

var newRender = function(items) {
     var that = this

     items = $(items).map(function (i, item) {
       i = $(that.options.item).attr('data-value', item)
       i.find('a').html(that.highlighter(item))
       return i[0]
     })

     this.$menu.html(items)
     return this
};
$.fn.typeahead.Constructor.prototype.render = newRender;

$.fn.typeahead.Constructor.prototype.select = function() {
    var val = this.$menu.find('.active').attr('data-value');
    if (val) {
      this.$element
        .val(this.updater(val))
        .change();
    }
    return this.hide()
};

これは、ブートストラップの先行入力をオーバーライドして、最初は何も選択しないようにします

于 2016-06-13T09:43:35.850 に答える