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()首先声明代码块时，它自行修复，然后赋予字段焦点。如果我颠倒顺序，.typeahead()功能就会中断。

$('#myField').typeahead({
    ...
});

$('#myField').focus();
于 2013-04-11T16:37:44.313 回答
8

typeahead 有它自己的焦点方法版本。焦点事件的默认行为被阻止，因此唯一的方法是保持预先输入的引用。

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

然后你就打电话typeaheadReference.focus();

于 2014-05-21T15:42:03.263 回答
4

不要问我为什么，但这是唯一对我有用的东西：

setTimeout("$('[name=search_input]').focus();", 0)
于 2015-04-09T22:23:08.290 回答
2

Typeahead 正在积极阻止默认焦点事件。我不知道为什么（也许有一个用例，焦点会提前输入，我还没有看到）。

在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”后，找到代表输入框的元素并将焦点设置为该元素。如下所示，输入元素具有分配给它的类“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

我创建了一个 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 回答
0

也许输入是隐藏的。

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

我最终使用点击事件而不是焦点，它对我有用。

于 2015-08-11T08:35:09.147 回答