javascript - 使用 JavaScript 初始化 BootStrap Typeahead 时出现问题

Question

我有一个简单的 Bootstrap typeahead，如下所示:

<input tabindex="1" type="text" name="q" class="search-query" id="wSearch" 
    data-provide="typeahead" data-items="3" 
    data-source='["AL", "AK", "AZ", "AR", "CA", "CO", "CT"]' 
    placeholder="Search">

效果很好。

也就是说，我希望数据来自 ajax 调用，因此我想使用 JavaScript 转换预输入初始化。当我写这篇文章时，我的预输入不起作用:

var options = {
    items: 3,
    source: ["AL", "AK", "AZ", "AR", "CA", "CO", "CT"]
};
$("#wSearch").typeahead(options);

...

<input tabindex="1" type="text" name="q" class="search-query" 
    id="wSearch" placeholder="Search">

我可以单步执行代码并看到它正在执行，并且没有看到任何 JavaScript 错误，但预输入根本不起作用。

我一定错过了一些微不足道的东西，但是，在盯着它看了很长一段时间后，我仍然没有看到它。

有什么想法吗？

Answer 1

用 $(document).ready(); 包围您的代码它尝试在 DOM 准备好之前加载。

$(document).ready(function(){
   var options = {
    items: 3,
    source: ["AL", "AK", "AZ", "AR", "CA", "CO", "CT"]
   };
   $("#wSearch").typeahead(options);
});