如何在Bootstrap 3中使用typeahead.js?

4
我正在为展示制作一个原型应用程序,并使用 Twitter Bootstrap 3 (http://getbootstrap.com - 特别是版本 3.1.1)。我想使用 typeahead.js (http://twitter.github.io/typeahead.js/ - 目前版本为 0.10.1) 来提供搜索建议。
我看过一些先前版本的示例,但没有看到与最新版本相关的内容。
如何最好地集成这两个工具?
根据我看到的少数示例,这是我试图做的:
<input type="text" class="typeahead form-control input-sm" id="searchField1"/>

然后

$(document).ready(function() {
  $('#searchField1').typeahead({
    name: 'keywords',
    local: ['foo', 'bar']
  });
});

然而,我认为事情已经有所发展。
1个回答

5

这是否意味着typeahead.js(http://twitter.github.io/typeahead.js/)不能直接与Bootstrap 3兼容,我需要使用其他替代方案? - Vihung
@Vihung,twitter.github.io/typeahead.js与Bootstrap 3版本不兼容。我在顶部给你的链接是为Bootstrap 3构建的。实际上,开发人员将Bootstrap 2代码迁移到了Bootstrap 3。 - Mo.
@Vihung,我在http://www.vanmaram.com/的旧版本中也遇到了很多问题,所以我打算在下个周末实现新版本 :) - Mo.
@MuhammedAthimannil,您能否详细说明您遇到的问题? - Parth Shah
你能否发布一个使用这个的完整工作示例? - M.M
这还准确吗?https://github.com/bassjobsen/Bootstrap-3-Typeahead 上说:“随着 Twitter Bootstrap 3 的推出,typeahead 插件已被删除...Twitter 的 typeahead 不能直接与 Bootstrap 3 一起使用。typeahead.js 使用的下拉菜单的 DOM 结构与 Bootstrap 下拉菜单的 DOM 结构不同。” - Andy

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接