超级基本的Twitter类型页面不起作用

Question

我正在尝试使用"带有多个截面的多个部分"的第一页，但是我很难弄清楚这一点。

js bin在这里：http：//jsbin.com/degu/5/edit?html.css，js ,, output

JSON文件存储在本地服务器上，其中包含来自Twitter-typehead网站的默认数据。

更新了JS bin文件：http：//jsbin.com/babe/1/edit?html，js ,, output

Answer 1

使用JS bin，我已经重新创建了在Typeahead.js示例中找到的"死去的简单"示例：

http://jsbin.com/levo/1

请注意，该网站上还有很多其他示例的示例。

您知道的来源是：

// instantiate the bloodhound suggestion engine
var numbers = new Bloodhound({
  datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.num); },
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  local: [
    { num: 'one' },
    { num: 'two' },
    { num: 'three' },
    { num: 'four' },
    { num: 'five' },
    { num: 'six' },
    { num: 'seven' },
    { num: 'eight' },
    { num: 'nine' },
    { num: 'ten' }
  ]
});
// initialize the bloodhound suggestion engine
numbers.initialize();
// instantiate the typeahead UI
$('.typeahead').typeahead(null, {
  displayKey: 'num',
  source: numbers.ttAdapter()
});

要获得"带有标题的多个部分"示例，您需要在本地开发，否则您需要使用远程源来启用JS bin访问本地托管的JSON文件。

请注意，您的示例（即http://jsbin.com/babe/1/edit）不起作用的原因是：

• 您缺少对JQuery 1.9
的引用
• 您忘了添加打开主体和DIV标签

还建议您使用"脚本"元素包括对库的依赖项，而不是将整个库放入JS bin" JavaScript"部分中；保留使用参考库的代码" JavaScript"部分。