Bootstrap 在页面加载时作为自执行功能运行。通过向 DOM 添加一个新元素 - 到那时,bootstrap-tagsinput.js
对它一无所知。因此,您必须在通过 JavaScript 将其添加到 DOM 文档后对其进行初始化。
要刷新输入标签 ( Bootstrap Tagsinput Docs ):
$('input').tagsinput('refresh');
所以对你来说,你需要:
/**
* On <div id="addrun"> on click,
* pre-apend it with an new Input
*
* Then refresh Bootstrap.
**/
$('#addrun').click(function(){
$('#addrun').before(
'<input type="text" '+
'value="Amsterdam,Washington,Sydney,Beijing" '+
'data-role="tagsinput" />'
);
//Now run bootstrap.js to re-search
//new data-* elements
$('input').tagsinput('refresh');
});
希望有帮助!虽然,上面$('input')
会刷新<input>
整个文档中的每个标签,所以你可以给前置<input>
标签一个 .class 或一个 #ID 以便更快地访问 =)
更新:
正如koala_dev在评论中正确提到的那样,您可能不需要通过以下方式初始化它,$('selector').tagsinput('refresh')
而只需:
$('#selecor').tagsinput();
.tagsinput('refresh')
通常会对.tagsinput()
已经使用给定的新选项初始化的输入进行操作。