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

Question

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

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

[编辑]
我将整个代码（js和json）移动到jsbin，因此跨域调用不应该有任何问题。

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

我还要感谢有关如何有效调试typeahead.js调用的提示。

Answer 1

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

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

现在，预先输入控件可以正常工作，但是当您搜索它们时，它会将建议结果显示为“未定义”。这是因为您的显示键不正确，应该是：

displayKey: 'genre'

可以找到工作示例here。

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

debugger;

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

或者，在您的示例中打开浏览器控制台，单击“Sources”选项卡，然后导航到“（no domain）/vajamixubo.js”。这是由jsbin执行的javascript，你可以在这里放置断点。