為什么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版本。