Select2錯誤取消選擇

我正在使用select2與multipleselect元素來創建一個更簡單的用戶界面，用於將多個項目添加到選擇。一切正常運行 - 我可以創建選擇器，添加項目和刪除項目，但是，在查看我的Javascript控制檯日誌時，我在取消選擇項目時收到兩個不同的錯誤。Select2錯誤取消選擇

Uncaught TypeError: Cannot read property 'id' of undefined
Uncaught TypeError: Cannot read property 'query' of null

，從我發現，這些錯誤是這些線路的結果：

$('#eleId').on("select2:unselect", function(){ 
    $('#eleId').select2(); 
});

我已刪除了一些代碼，試圖查明錯誤，但通常這個代碼塊會更新元素的一些屬性，在select2({...})調用中設置。第一次錯誤是在選擇選項面板被打開和關閉後第一次移除元素，所以如果用戶點擊選擇器，添加一個項目，然後刪除該項目的第一個錯誤被觸發。第二個錯誤發生在元素在打開和關閉選擇面板之後不會立即被刪除，因此如果用戶要添加三個項目，刪除第一個會給第一個錯誤，刪除第二個和第三個會產生第二個錯誤每個項目刪除。

如果我刪除功能的錯誤走開內select2()電話，但這些錯誤似乎是由unselect本身被觸發，因爲我已經添加了一個日誌聲明函數的結束，這將錯誤之前打印打印。

工作副本：

<html> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
     <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" /> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script> 
    </head> 
    <body> 
     <select multiple id='eleId'> 
      <option>1</option> 
      <option>2</option> 
      <option>3</option> 
     </select> 
    </body> 
    <script> 
     $(document).ready(function() { 
      $('#eleId').select2(); 
     }); 
     $('#eleId').on("select2:unselect", function(){ 
      $('#eleId').select2(); 
     }); 
    </script> 
</html>

來源

2017-08-16 yanman1234

我認爲這個問題是你的'（「選擇2：取消選擇」）'，但不能承諾什麼，試圖創建的工作片段問題，那麼我們有更好的機會幫助你 –

@CarstenLøvboAndersen我已經添加了代碼來重複我的確切錯誤 – yanman1234

Yanman你想完全清除1嗎？因爲你的問題有點不清楚你想要什麼。但嘗試用'$（「＃eleId」）選擇2（「VAL」，「所有」）;' –

做一些更多的研究後，我發現這個錯誤是由非選擇事件後選擇2不加載選擇元素在時間上造成的，所以它不能立即找到列出的屬性。爲了解決這個問題，我需要換一個setTimeout()的.select2()通話這樣：

$('#eleId').on("select2:unselect", function(){ 
    setTimeout(function(){ 
     $('#eleId').select2(); 
    }); 
});

這給選擇2只足夠的時間來訪問此屬性之前加載的元素。雖然這可以解決這些錯誤，但是在刪除選擇時，它會在選擇面板上產生閃爍效果。爲了解決這個問題我修改opening事件是如何在這段時間處理：

$('#eleId').on("select2:unselect", function(){ 
    $(this).on('select2:opening', function(e) { 
     e.preventDefault(); 
    }); 
    setTimeout(function(){ 
     $('#eleId').select2(); 
    }); 
    $(this).on('select2:unselect', function() { 
     var sel = $(this); 
     setTimeout(function() { 
      sel.off('select2:opening'); 
     }); 
    }); 
});

來源

2017-08-16 15:55:59 yanman1234

Select2錯誤取消選擇

回答

相關問題