如何为bootstrap标签选择输入添加默认值?

时间:2017-08-16 05:48:23

标签: javascript jquery twitter-bootstrap

我使用Bootstrap tag plugin并使用此代码成功添加了一些标记:

$(function () {            
                var data = [{"id":"1","value":"painting-works"},{"id":"2","value":"plumbing-works"},{"id":"3","value":"programming"}];    
                var states = new Bloodhound({
                    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
                    queryTokenizer: Bloodhound.tokenizers.whitespace,
                    local: data
                });
                states.initialize();
                $("#tags").tagsinput({
                    itemValue: 'id',
                    itemText: 'value',
                    allowDuplicates: false,
                    maxTags: 1,    
                    typeaheadjs: {
                        name: "states",
                        displayKey: 'value',
                        source: states.ttAdapter(),
                    },
                    freeInput: true
                });  
});

,输入元素是

<select placeholder=""  class="bootstrap-tagsinput"  id="tags"></select> 

成功添加标签 enter image description here

但我想要的是在页面加载时向输入元素添加默认值 enter image description here

我试过这段代码

$('#tags').tagsinput('add', 'new');

但它只添加了一个新标签 我试图使用jQuery

$('#tags').val("painting-works");

但它没有用,我该怎么办?

1 个答案:

答案 0 :(得分:1)

请注意,您正在使用对象数组作为数据,因此您需要在页面加载时将其中一个对象传递给tagsInput

$('#tags').tagsinput('add', {"id":"1","value":"painting-works"});  

这是带解决方案的jsfiddle