2011-05-17 145 views
2

我們遇到了一個問題,試圖將選擇器鏈接在一起。我們試圖獲取所有已選中的複選框,並將hide-data的data-action屬性作爲值。我有一個有兩個複選框,一個按鈕就可以了這個JavaScript的網頁:jQuery選擇器鏈接

<script type="text/javascript"> 
    var hiddenplans = $('input:checkbox[data-action="hideplan":checked'); 
    $("#hide_btn").click(function() { 
     hiddenplans.each(

     function(index) { 
      alert('checked' + index); 
     }); 
    });​ 
</script> 

這並不顯示在一個或更多的複選框被選中任何警報 - hiddenplans是空的。但是,如果我們複製$('input:checkbox[data-action="hideplan":checked');並將其放入Firebug控制檯並運行,如果選中一個或多個複選框,我們將獲得結果。如果我刪除:選中它將通過data-action = hideplan提醒複選框。

我們嘗試了幾種不同的方式來編寫選擇器(即$("input[type=checkbox][data-action=hideplan]:checked")$("input[type=checkbox][data-action=hideplan]").filter(":checked");以及更多),它們在控制檯中工作,但不會返回警報。

我已經創建了完整的代碼小提琴情況下,我們錯過了一些明顯的http://jsfiddle.net/xCnSs/5/

回答

1

你緩存選擇在一個變量設置成它只會返回哪些項目在頁面加載時檢查。移動此選擇到您的點擊功能,它會工作:

$("#hide_btn").click(function() { 
    var hiddenplans = $("input[type=checkbox][data-action=hideplan]:checked"); 
    hiddenplans.each(function (index) { 
     alert('checked' + index); 
    }); 
}); 

http://jsfiddle.net/xCnSs/6/

+0

指出這是正確的 – Mitch 2011-05-17 00:33:27

+0

是的,我知道這一點。我只是想看看你是否做到了。謝謝! – lightyeare 2011-05-17 02:26:00

3

嘗試......

$('input:checkbox[data-action="hideplan"]:checked') 

jsFiddle

+0

請記住,使用最僞選擇前一個標籤,否則通用選擇'*'是隱含的,需要*每次測試*頁面上的元素。 :o)從文檔:*「與其他僞類選擇器(以」:「開頭的選擇器)一樣,建議在它之前加上標籤名稱或其他選擇器;否則,通用選擇器(」\ * 「)暗示。」* – user113716 2011-05-17 00:32:31

+0

@patrick是的,這將是更高性能。 :) – alex 2011-05-17 00:36:12

0

你忘了關閉支架:

$('input:checkbox[data-action="hideplan"]:checked'); 

但要記住,你還可以過濾結果:

$('input:checkbox[data-action="hideplan"]').filter(':checked'); 
+0

只是一個錯字。沒有解決這個問題。問題是由mVChr – lightyeare 2011-05-17 02:29:39