编辑:已添加可用的JSFiddle
我正在使用Twitter Bootstrap TagsInput与Bootstrap Typeahead。我的数据源是JSON文件,但这并不重要,我已经使用静态源进行了检查。
Typeahead和tagsinput正在工作,但当我按下Enter键、Tab键或单击标签时,它会创建一个完整的重复。
每当我按下Enter键或完成Typeahead时,都会发生额外的“default”。如果我通过逗号分隔或将焦点从窗口中移开来打破Typeahead,则不会发生这种情况。
以下是输入:
<input id="itemCategory" type="text" autocomplete="off" class="tagsInput form-control" name="itemCategory">
以下是脚本代码:
<script>
$('.tagsInput').tagsinput({
confirmKeys: [13, 44],
maxTags: 1,
typeahead: {
source: function(query) {
return $.get('listcategories.php');
}
}
});
</script>
我相信这是一些奇怪的问题,可能无法重现,但我希望有人能提供一些机构知识,了解可能导致此类问题发生的原因。
以下是额外文本的图像,在开发工具中:
非常感谢任何建议或建议。谢谢。
可行代码
由于@Girish的帮助,以下内容“解决”了这个问题。 我认为这是一个错误,目前在jQuery或Typeahead的更近版本中引入。 这段代码只是手动删除多余的元素,尽管希望有些东西会出现,以防止它被放置在那里,从而消除额外的代码。 现在对我有用。
$('.tagsInput').tagsinput({
confirmKeys: [13, 44],
maxTags: 1,
typeahead: {
source: function(query) {
return $.get('tags.php');
}
}
});
$('.tagsInput').on('itemAdded', function(event) {
setTimeout(function(){
$(">input[type=text]",".bootstrap-tagsinput").val("");
}, 1);
});