14

これらの属性を削除すると:

data-source="<?=str_replace('"', '&quot;', json_encode($equipment, JSON_HEX_TAG | JSON_HEX_APOS)); ?>" data-items="4" data-provide="typeahead"

私はこれを実行できます：

$(document).ready(function() {
    $('.first').focus();
});

これは、これに対する私の HTML マークアップです。

<div class="itemx">
    <input type="text" class="input-large first" autocomplete="off" placeholder="Equipment Name/Label" name="equip[]" data-source="<?=str_replace('"', '&quot;', json_encode($equipment, JSON_HEX_TAG | JSON_HEX_APOS)); ?>" data-items="4" data-provide="typeahead" />
    <input type="text" class="input-large second" placeholder="Quantity" name="quant[]" />
</div>

注: Typeahead はこれで問題なく機能します。

data-source="<?=str_replace('"', '&quot;', json_encode($equipment, JSON_HEX_TAG | JSON_HEX_APOS)); ?>"
4

9 に答える 9

8

typeahead には独自のバージョンの focus メソッドがあります。デフォルトの動作ではフォーカス イベントが防止されるため、唯一の方法は先行入力参照を維持することです。

var typeaheadReference = $('.typeahead').typeahead({ ... };

それからあなたはただ電話するtypeaheadReference.focus();

于 2014-05-21T15:42:03.263 に答える
2

Typehead はデフォルトのフォーカス イベントをアクティブにブロックしています。理由はわかりません (おそらく、フォーカスがタイプアヘッドで壊れるユースケースがあるかもしれませんが、私はそれを見たことがありません)。

typeahead.js ソース(最後の316 ～ 321 行目):

  $(document).on('focus.typeahead.data-api', '[data-provide="typeahead"]', function (e) {
    var $this = $(this)
    if ($this.data('typeahead')) return
    e.preventDefault()
    $this.typeahead($this.data())
  })

への変更：

  $(document).on('focus.typeahead.data-api', '[data-provide="typeahead"]', function (e) {
    var $this = $(this)
    if ($this.data('typeahead')) return true
    $this.typeahead($this.data())
  })

true を返すと、フォーカス イベントが完了し (先行入力が確立されたときに最初のフォーカス後にのみ実行されます)、e.preventDefault()呼び出しを削除すると、初期設定でフォーカスを起動できます。

変更のプル リクエストがあります - 作成者の応答で回答を更新します。

于 2013-01-30T21:01:52.200 に答える
1

使用しているバージョンによって異なりますが、0.9.3 でこの問題に遭遇しました。

最もクリーンではありませんが、タイムアウトを設定することができます:

setTimeout(function(){ $('.first').focus(); }, 0);

于 2014-02-24T16:48:08.200 に答える
1

typeahead.js 0.10.2 を使用すると、Evil Closet Monkey によって指定されたソリューションがほとんど機能しました。指定されているように、「typeahead」の呼び出し後にフォーカスを設定する必要がありますが、「typeahead」の呼び出しは DOM を操作し、追加の要素を追加することに注意してください。「typeahead」を呼び出した後、入力ボックスを表す要素を見つけて、それにフォーカスを設定します。以下に示すように、input 要素にはクラス「tt-input」が割り当てられています。

例：

html:

<div id="levelSearchBox" style="clear: both">
    <input class="typeahead" type="text" placeholder="Search" data-bind="value: selectedRootLevel" />
</div>

js:

    $('#levelSearchBox .typeahead').typeahead({
        hint: true,
        highlight: true,
        minLength: 0,
        autoselect: true
    }, {
        displayKey: 'name',
        source: levels.ttAdapter()
    }).on('typeahead:selected', function ($e, datum) {
        selectedCallBack(datum["name"]);
    });

    $('#levelSearchBox .tt-input').focus();
于 2014-05-08T09:02:21.043 に答える
0

入力が隠されている可能性があります。

$('input:visible').focus();
于 2012-11-29T13:07:56.763 に答える
0

フォーカスの代わりにクリックイベントを使用することになり、それは私にとってはうまくいきます。

于 2015-08-11T08:35:09.147 に答える
0

ライブラリのバージョンをすばやくテストするための jsfiddle を作成しました http://jsfiddle.net/uryUP/

コードの別の部分が入力ボックスを無効にしてフォーカスが失敗していることに気付きましたが、これにより、それがライブラリではなく私のコードであることがわかりました

$('#locationSearchText').typeahead({
            minLength: 1,
            highlight: true
        },
        {
            source: function (query, process) {
                return process([{value:'abcdefg'}]);
            }
        });

$('#locationSearchText').focus().typeahead('val', 'abc');
于 2014-07-02T19:14:10.907 に答える