計算列表中選項的數量

我試圖計算列表中選項的數量。但是，由於搜索文本輸入到輸入框中，因此某些選項已被隱藏。計算列表中選項的數量

我開始研究.size（）和.length，但只獲取完整列表，而不是那些未隱藏的列表。爲了簡化，我已經改變它來嘗試找到隱藏的選項（我可以使用：不晚）。我也試過：console.log（$（'＃selContactLists option：hidden'））; 我從來沒有得到我期待的數字。任何人都可以看到我要去哪裏嗎？

更奇怪的是，如果我更改了select的「大小」，以便默認顯示多個項目，則在chrome上永遠不會隱藏任何選項。

來源

2012-08-14 David

你還可以發佈一個HTML例子嗎？ – Stefan 2012-08-14 14:43:21

關於'size（）'的注意事項會導致你提及它。它被標記爲depraated。從文檔：The .size（）方法在功能上等同於.length屬性;然而，.length屬性是首選，因爲它沒有函數調用的開銷。「（http://api.jquery.com/size/） – Nope 2012-08-14 14:45:55

這些選項在什麼基礎上隱藏或顯示？ – 2012-08-14 15:33:44

這對我的作品，但你可能需要手動添加和刪除的CSS顯示：從元素，而不是使用顯示/隱藏，出於兼容性考慮，無...

alert($('#selContactLists option:not([style*=none])').length);

來源

2012-08-14 16:24:25 LJ2

我幾乎不理你的答案，這似乎太容易了。我錯了。幹得好，謝謝！ – David 2012-08-15 10:31:57

使用jQuery的:visible選擇器。

$('#selContactLists option:visible').length;

來源

2012-08-14 14:41:43

嗨，詹姆斯，這總是回來零。我使用.hide（）將它們從視圖中隱藏起來，但在列表已從3個選項過濾到2的示例中，我仍然獲得0 – David 2012-08-14 15:04:42

@David，發佈您的標記。更好的是，給我們一個例子[小提琴]（http://jsfiddle.net）。 – 2012-08-14 15:17:03

http://jsfiddle.net/kcRUB/3/ – David 2012-08-14 15:26:27

這似乎工作的一種方法如下，雖然它欺騙，一定程度上，通過分配是隱藏的，並且顯示的選項，變量，然後使用這些變量的.length屬性：

$('#txtListSearch').keyup(
    function(e) { 
     var val = $(this).val().toLowerCase(), 
      sel = $('#selContactLists'); 
     if (val.length < 1) { 
      sel.find('option').show(); 
     } 
     else { 
      var shown = sel.find('option').filter(

       function() { 
        return $(this).text().toLowerCase().indexOf(val) !== -1; 
       }).show().first().prop('selected',true), 
       hidden = sel.find('option').filter(

       function() { 
        return $(this).text().toLowerCase().indexOf(val) == -1; 
       }).hide(); 
      console.log(shown.length, hidden.length); 
     } 
    });

JS Fiddle demo。

請注意，以上是對原始代碼進行比較大的重寫。我已經使用了一些選擇器緩存來減少DOM方法在keyup方法中的訪問次數，並且由於方法.toLowerCase()這是一個不區分大小寫的搜索，並且也將selectedIndex轉換爲第一個非隱藏選項（在Chromium中，這似乎是爲了使one在select中顯示，同時鍵入t時隱藏）所必需的。

來源

2012-08-14 16:25:29

這仍然不適合我。我顯示和隱藏的計數都不正確。上述所有嘗試都會在每個瀏覽器中產生不同的結果。我認爲將選項存儲在單獨的數組中，然後填充或刪除元素是最好的選擇。我試圖增加選擇框的大小，因此一次顯示多個元素，在這種情況下，沒有任何元素被隱藏。我認爲隱藏並不是一個好主意，去除是答案。我已經爲你的答案+1了，因爲它不太合適（至少對我來說），但它讓我走上了正確的道路。 – David 2012-08-15 10:05:49

計算列表中選項的數量

回答

相關問題