javascript - Bootstrap Tags 在输入后自动清除自定义值

Question

我正在使用bootstrap-tagsinput 。下面的代码工作正常，但我想自动清除 json 中不存在的特定输入值。用户只需从标签中进行选择，他不能提交自定义值。我还使用了“freeInput:false”，但它仍然在前端显示值。请帮我解决这个问题。

Jquery

var languages = new Bloodhound({
 datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name')
 , queryTokenizer: Bloodhound.tokenizers.whitespace
 , prefetch: './assets/languages.json'
});
languages.initialize();
$('#inputtag').tagsinput({
 freeInput: false
 , typeaheadjs: {
     name: 'id'
     , displayKey: 'name'
     , valueKey: 'name'
     , limit: 10
     , source: languages.ttAdapter()
 }
});

HTML

<input type="text" data-role="tagsinput" id="inputtag" value="" name="language[]" required data-msg-required="Please enter your language" multiple class="form-control tag">

Answer 1

尝试下面的代码，这可能会对您有所帮助。

var languages = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name')
 , queryTokenizer: Bloodhound.tokenizers.whitespace
 , prefetch: './assets/languages.json'
});

languages.initialize();
$('#inputtag').tagsinput({
 freeInput: false
 , addOnBlur : false
 , typeaheadjs: {
    name: 'id'
    , displayKey: 'name'
    , valueKey: 'name'
    , source: languages.ttAdapter()
  }
});

$('#inputtag').tagsinput('input').blur(function() {
    $(this).val('');
}); 

在 github 上检查此问题