javascript - Bootstrap-Tags输入确认键不起作用

我无法获得默认的Bootstrap-TagsInput confirmKeys，即enter = 13或comma = 188，无法直接使用。有或没有Typeahead.js都是如此。确认键允许您通过单击该键来创建标签。

我认为问题在于标记是字符串还是对象。如果查看the Tagsinput demo，则“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
    }

}

然后，在要使用此库修改的人的代码库中的任何地方，我都添加了以下内容:

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++;

});