tim*_*son 5 html javascript jquery typeahead.js bootstrap-tags-input
我无法让默认的 Bootstrap-TagsInput confirmKeys(即enter=13或comma= 188)开箱即用。不管有没有Typeahead.js都是如此。确认键允许您通过单击该键来创建标签。
我认为问题在于标签是字符串还是对象。如果您查看Tagsinput 演示,您会发现“Typeahead”示例允许使用默认的confirmKeys,enter或来创建标签comma,但其正下方的“Objects as Tags”示例则不允许。
知道如何confirmKeys使用对象标签进行工作吗?
我必须编辑 Bootstrap-tagsinput 库才能完成这项工作。
这是我在库中添加/注释的内容:
//self.options.freeInput = false; //notice commented out
//... (lots of lines between)
if (self.options.freeInput && (keyCombinationInList(event, self.options.confirmKeys) || maxLengthReached)) {
// Only attempt to add a tag if there is data in the field
if (text.length !== 0) {
//<<<<< BEGIN code block added
//self.add(maxLengthReached ? text.substr(0, self.options.maxChars) : text); //notice commented out
var item2 = self.$input.val();
if (self.objectItems) {
var beforeFreeInputItemAdd = $.Event('beforeFreeInputItemAdd', { item: item2, cancel: true });
self.$element.trigger(beforeFreeInputItemAdd);
if (beforeFreeInputItemAdd.cancel)
return;
item2 = beforeFreeInputItemAdd.item;
}
self.add(item2);
self.$input.val('');
// $input.val(''); //>>>>>> END code block added
}
}
Run Code Online (Sandbox Code Playgroud)
然后在代码库中想要使用此库修改的任何地方我添加了以下内容:
var id_increment = 1;
$("#my-tagsinput-field").on('beforeFreeInputItemAdd', function(event) {
event.item = {'name': event.item, 'id': 'new-'+id_increment};
event.cancel = false;
id_increment++;
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
2263 次 |
| 最近记录: |