Bootstrap標籤輸入不與延遲加載

Question

我有一個模式，通過點擊頁面上的任何一個圖像，我有一個輸入字段，我試圖應用bootstrap-tagsinput啓動。

$(document).on("click","a.lazy",function(){   
     $("#form").find(".title").attr('value',$(this).find(".title").val()); 
     $("#form").find(".title").attr('data-role','tagsinput'); 
     $("#form").modal("show"); 
}); 

我分配值和數據的作用與lazyload屬性下列輸入字段：

<div class="input-group"> 
    <span class="input-group-addon">Tags</span> 
    <input type="text" class="form-control title" placeholder="Enter Tags for the Image" name="title"> 
</div> 

一旦我啓動模式，我可以看到的是，屬性是存在，但標籤不應用。我究竟做錯了什麼？

<input type="text" class="form-control title" placeholder="Enter Tags for the Image" name="title" value="yellow" data-role="tagsinput"> 

Answer 1

只是增加data-role是不夠的，輸入字段 - 因爲你將它添加動態，你需要初始化引導標籤輸入像這樣：

$(document).on("click","a.lazy",function(){   
     $("#form").find(".title").attr('value',$(this).find(".title").val()); 
     $("#form").find(".title").attr('data-role','tagsinput'); 

     // Destroy all previous bootstrap tags inputs (optional) 
     $('input[data-role="tagsinput"]').tagsinput('destroy'); 
     // Create the bootstrap tag input UI 
     $('input[data-role="tagsinput"]').tagsinput('items'); 

     $("#form").modal("show"); 
});