Twitter的引導3事先鍵入的內容/ Tagsinput完成兩次

Question

編輯：新增working JSFiddle

我使用Twitter的引導TagsInput與引導事先鍵入的內容。我的源代碼是一個json文件，但這是無關的，我檢查了一個靜態源。

的預輸入和tagsinput工作正常，但是當我按回車鍵，選項卡，或點擊一個標籤，它會創建一個重複的完整。

，每當我按回車，或完成預輸入奧妙「默認」情況。如果我用逗號分開，或者將焦點從窗口中分離出來，則不會發生。

這裏是輸入：

<input id="itemCategory" type="text" autocomplete="off" class="tagsInput form-control" name="itemCategory"> 

這裏是腳本：

<script>       
     $('.tagsInput').tagsinput({ 
      confirmKeys: [13, 44], 
      maxTags: 1, 
      typeahead: {     
      source: function(query) { 
       return $.get('listcategories.php'); 
      } 
      } 
     }); 
    </script> 

我敢肯定，這東西靠不住的，這將不會是可再現的，跟我的運氣，所以我希望有人會有一些他們知道會導致類似事情發生的體制知識。

下面是dev中額外文本的圖像。工具：

我真的很感激任何意見或建議。謝謝。

工作代碼

由於@Girish，下面是什麼 「固定」 這一問題。我相信這是一個錯誤，在更新版本的jQuery或Typeahead的某個地方推出。這段代碼只是手動刪除額外的元素，儘管希望有東西會出現，以防止它被放置在那裏，消除額外的代碼。現在它適用於我。

 $('.tagsInput').tagsinput({ 
      confirmKeys: [13, 44], 
      maxTags: 1, 
      typeahead: {     
      source: function(query) { 
       return $.get('tags.php'); 
      } 
      } 
     }); 
     $('.tagsInput').on('itemAdded', function(event) { 
      setTimeout(function(){ 
       $(">input[type=text]",".bootstrap-tagsinput").val(""); 
      }, 1); 
     }); 

Answer 1

我不知道這是尋找漏洞，內部功能沒有自定義代碼，而是選擇標籤中輸入字段重複，但可以使用替代解決方案，itemAdded事件從input字段中刪除選定的值，請參閱下面的示例代碼。

$('input').tagsinput({ 
    typeahead: { 
    source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo'] 
    }, 
    freeInput: true 
}); 
$('input').on('itemAdded', function(event) { 
    setTimeout(function(){ 
     $(">input[type=text]",".bootstrap-tagsinput").val(""); 
    }, 1); 
}); 

我也注意到了輸入字段生成的每個標籤部分，因此this或event無法有針對性的標籤輸入字段，因爲你還需要推遲從<selector>選擇輸入元素動態生成的輸入字段

DEMO

UPDATE：$.get()函數返回xhr對象不是服務器的響應，因此需要添加callback獲取AJAX響應的方法，請參閱下面的示例代碼。

$('.tagsInput').tagsinput({ 
     confirmKeys: [13, 44], 
     maxTags: 1, 
     typeahead: {     
      source: function(query) { 
      return $.get('listcategories.php').done(function(data){ 
       /*if you have add `content-type: application/json` in 
       server response then no need to parse JSON otherwise, 
       you will need to parse response into JSON.*/ 
       return $.parseJSON(data); 
      }) 
      } 
     } 
});