将typeahead.js与bloodhound.md和外部json一起使用

Use typeahead.js with bloodhound.md and an external json

本文关键字：json 外部 一起 md typeahead js bloodhound      更新时间：2023-09-26

我尝试将typeahead.js与bloodhound.md和外部json数据源一起使用。我想我会尽可能准确地遵循github上提供的文档和示例。然而，我未能实现所需的下拉列表。

你能告诉我，我做错了什么吗？

[edit]
我把整个代码（js和json）移到了jsbin中，所以跨域调用应该不会有任何问题。

在此处查找示例代码：http://jsbin.com/vajamixubo/1/edit?html，js，输出

我也将感谢提示如何有效地调试typeahead.js调用。

关于您的示例，您缺少对Typeahead和Bloodhound库的引用。将以下内容添加到HTML中：

<script src="http://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.10.4/typeahead.bundle.min.js"></script>

现在，typeahead控件将工作，但当您搜索建议结果时，它将显示为"未定义"。这是因为你的显示键不正确，应该是：

displayKey: 'genre'

工作示例可在此处找到。

最后，要在浏览器中轻松调试javascript，请添加：

debugger;

添加到代码中（例如，尝试将其放在javascript的开头）。如果打开浏览器控制台，脚本执行将在这些调试语句处停止。

或者，在您的示例中，打开浏览器控制台，单击"Sources"选项卡，然后导航到"（无域）/vajmixubo.js"。这是由jsbin执行的javascript，您可以在此处放置断点。

相关文章：