为什么twitter bootstrap的预输入在这里不起作用？

Question

我正在尝试让typeahead.js在我的项目中工作。 我在项目中加载了引导程序（刚刚从引导程序站点下载了源代码）。 在源代码中查找并没有提及typeahead，因此我包含了独立的js文件。

尝试使用它时，没有出现任何错误，但是它没有用。 简单的代码：

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

var source = ["test1", "test2", "test3", "test4"];

$('.typeahead').typeahead({
    source: source })

jsfiddle： 链接

我究竟做错了什么？ （请注意，我的js位于jsfiddle的底部）

Answer 1

您使用的typeahead.js版本与调用它的版本不同。

最新版本的typeahead期望使用可变数量的数据集参数。 查看我的小提琴的更新版本： http : //jsfiddle.net/DTcHh/458/

var source = ["test1", "test2", "test3", "test4"];

function mySource(query, callback){
  srcs = [];
  for(var idx in source){
      var src = source[idx];
      if(src.indexOf(query) !== -1){
        srcs.push({value: src});
      }
  }
  console.log(srcs);
  callback(srcs);
}

$(document).ready(function(){
    var t = $(".typeahead");
    t.typeahead({}, {'source': mySource});
});

对于每个数据集，都需要有一个指向函数的source属性。 该函数采用查询字符串和回调函数。 期望您对查询字符串执行所需的操作，然后使用对象列表调用回调函数，其中每个对象的value属性都映射到要显示的值。

我认为您应该能够在选项中指定{'local': source} ，但是我还没有开始使用它。

无论如何，如果您想要旧的API，则必须使用Bootstrap 2的typeahead版本。