使用 typeahead 的标签管理器 jquery 插件答案

【问题标题】：tags manager jquery plugin using typeahead使用 typeahead 的标签管理器 jquery 插件
【发布时间】：2013-08-16 12:14:23
【问题描述】：

我想使用标签管理器（jquery 插件）。链接：http://welldonethings.com/tags/manager

在网站的示例中，我看到有一个使用预先输入的选项。

这就是我所做的：

HTML：

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="plugins/tagmanager/typeahead.js"></script>
<script type="text/javascript" src="plugins/tagmanager/bootstrap-tagmanager.js"></script>
<link rel="stylesheet" href="plugins/tagmanager/bootstrap-tagmanager.css" rel="stylesheet">

<input type='text' class="input" data-provide="typeahead" name='tagsInput' id='tagsInput' value='' />

JavaScript：

$("#tagsInput").tagsManager({
        deleteTagsOnBackspace: false,
        prefilled: ["Pisa", "Rome"],
        typeahead: true,
        typeaheadAjaxSource: null,
        typeaheadSource: ["Pisa", "Rome", "Milan", "Florence", "New York", "Paris", "Berlin", "London", "Madrid"],
        blinkBGColor_1: '#FFFF9C',
        blinkBGColor_2: '#CDE69C',
        hiddenTagListName: 'hiddenTagListA'
});

我在 bootstrap-tagmanager.js:62 上收到此错误：

未捕获的类型错误：无法读取未定义的属性“原型”

我做错了什么？

如果我删除 typeahead.js 的包含，标签管理器插件正在工作，但没有 typeahead 选项。

示例：http://jsfiddle.net/F8C8c/

或者： 也许您可以向我推荐一个更好的标签管理器插件，它可以处理通过 ajax 加载的自动编译标签？

编辑： 我发现了问题。我应该需要包含 bootstrap.js 而不是 typeahead.js。

【问题讨论】：

它在他们的示例页面welldonethings.com/tags/manager中工作
我开始怀疑是否缺少插件。一些 JS 文件需要存在，但不存在。

标签： jquery bootstrap-typeahead

【解决方案1】：

问题是您使用了错误的“typeahead.js”模块。

您需要 bootstrap-typeahead.js。

在这里寻找它：

https://raw.github.com/tcrosen/twitter-bootstrap-typeahead/master/js/bootstrap-typeahead.js

【讨论】：

是的，即使是那个插件也需要 bootstrap.js。但是，仅仅添加插件就解决了原型错误的初始问题。