javascript - 允许在 bootstrap-tags 输入中自由输入(对象作为标签)

Question

我正在使用 bootstrap-tags 输入(对象作为标签)作为标签输入。正如官方文档所述，它可以与 typehead js 自动完成建议配合使用 Objects as tags 。但这只允许建议的标签作为输入，换句话说，只允许那些在 Json 列表中的标签。我尝试允许 freeinputs 以及具有默认值的列表中的建议标签(例如:stackoverflow Tags)。但我没能做到正确。 这是我的代码:

var cities = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('text'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            local: citilist //{value: 1, text: "Saint Lucia", continent: "Ararat"}... 
        });

        cities.initialize();
        var elt = $('#txt');
        elt.tagsinput({
            itemValue: 'value',
            itemText: 'text',
            typeaheadjs: {
                name: 'cities',
                displayKey: 'text',
                source: cities.ttAdapter()
            },
            freeInput: true
        });
        elt.tagsinput('add', { "value": 1, "text": "Amsterdam", "continent": "Europe" });

Answer 1

You can try this code. It's work for me. Please write this with your existing code.

var count = 0; 
$('body').on('keydown', '.tt-input', function (e) {
  if (e.keyCode === 9) {
    e.preventDefault();

    $('#your-tag-input-Id').tagsinput('add', { 
      value: --count, 
      text: $('.tt-input').val(), 
      continent: "Unsaved" 
    }); 

    $('.tt-input').val("");
  }
});

negative value is new added tag and positive value is suggested tags.

'.tt-input' is text box $('#txt') class.

编辑:建议将 count-- 改为 --count (先 -1，然后返回值)，以便 value的免费输入从 -1 开始