javascript - Bootstrap Typeahead 中的数据源不起作用

Question

这里非常直截了当的问题。我这里有这段代码。

<script src="{{ STATIC_URL }}js/typeahead_data_countries.js"></script>

<script type="text/javascript">
$(document).ready(function(){
    $('.typeahead').typeahead({
       source: country_array
   })
});

</script>

其中 typeahead_data_countries 是： var country_array = new Array("Afghanistan", "Albania", "Algeria",...);

变量被正确加载，但整个 typeahead 不起作用。但是，如果我这样做：

<input type="text" style="margin: 0 auto;" data-provide="typeahead" data-items="4" data-source='["Afghanistan", "Albania"]'/>

它有效，但我不想要那个......

Answer 1

我认为您的示例中的问题基于混合两种不同的方式来初始化typahead（js和data-*）。这个例子对我有用：

<input class="typeahead" type="text"/>
<script type="text/javascript">
     $(function(){
          $('.typeahead').typeahead({
             items:4,
             source: ['Aaaa', 'Abbb', 'Accc']
          });
     });
</script>

Answer 2

有趣的是，我得到这个工作的唯一方法是删除 $(function(){ }): 围绕其他所有内容。因此：

<input class="typeahead" type="text"/>
<script type="text/javascript">

    $('.typeahead').typeahead({
        items:4,
        source: ['Aaaa', 'Abbb', 'Accc']
    });

</script>