jQuery選擇問題

我使用這個代碼：jQuery選擇問題

$('fieldset input[type=checkbox]').each(function() {if($(this).attr('checked','checked')){ 
    var switches = $(this).parent().find('.switch'); 
    $(switches).attr('state','on') 
    $(switches).css({'left':"52px"}); 
    $(switches).parent().css({'background-position': "147px -37px"}); 
}})

但不知何故，我所有的複選框設置爲checked="checked"我只是愚蠢或者是在代碼干擾其他什麼東西？

感謝您的幫助:)

編輯：這裏是HTML

<fieldset> 
     <input checked="checked" /> 
     <label></label> 
     <div class="toggle_box"> 
      <div class="switch" state="on"></div> 
     </div> 
    </fieldset> 
    <fieldset> 
     <input/> 
     <label></label> 
     <div class="toggle_box"> 
      <div class="switch"></div> 
     </div> 
    </fieldset>

來源

2011-05-17 cmplieger

您將checked值作爲第二個參數傳遞給attr()。這導致它被設置。然後返回的是帶有input的jQuery對象，它總是一個真值。

你如果條件應該是這樣的（使用:checked僞類代替）：

if ($(this).is(':checked')) {

在一個側面說明，你的內碼可重構這樣：

$(this).parent().find('.switch') 
    .attr('state', 'on') 
    .css({ 'left': "52px" }) 
    .parent() 
     .css({ 'background-position': "147px -37px" });

如果你有使用緩存變量（即switches），你可以，但不要把它包裝在jQuery函數中。它本身就是一個jQuery對象，所以不需要打包。

來源

2011-05-17 03:49:58 BoltClock

這段代碼是幹什麼的......

$(this).attr('checked','checked')

...返回該設置爲了級聯工作。 Object在JavaScript中始終是truthy。

的Try ...

this.checked

...返回複選框是否被選中與否。如果您想要使用jQuery方式，請使用$(this).is(':checked')。雖然我不會，但它更冗長，性能更差。

來源

2011-05-17 03:49:55 alex

使用DOM的+1。 – 2011-05-17 03:51:37

我認爲合適的詞將是鏈接，而不是級聯（這是CSS）。 – BoltClock 2011-05-17 03:54:00

@BoltClock它被道格拉斯克羅克福德稱爲*級聯*。我想它可以被稱爲兩個。 – alex 2011-05-17 03:55:50

if($(this).attr('checked','checked'))將是你的問題。您將每個複選框分配爲checked，而不是檢查是否已選中。

來源

2011-05-17 03:50:08 Tyler

乍一看，我看到你正在使用.is('checked')當我相信你想前面的冒號是不同之處。

更新：我看到你更新了代碼。該行

if ($(this).attr('checked', 'checked'))

實際上是設置所有'input：checkbox'元素進行檢查。它應該是：

if ($(this).is(':checked'))

來源

2011-05-17 03:50:18

if語句中的語句是將您的複選框設置爲選中狀態。特別是，這個聲明：$(this).attr('checked','checked')。

相反，你可以做if($(this).prop('checked'))

瞭解更多關於jQuery Prop method。

或者，您可以這樣做：this.checked，它可以直接訪問DOM，也可以使用jQuery $(this).is(':checked')訪問DOM。

來源

2011-05-17 03:51:47 tyronegcarter

$('fieldset input[type=checkbox]').each(function() {if($(this).attr('checked') == 'checked')){ 
var switches = $(this).parent().find('.switch'); 
$(switches).attr('state','on') 
$(switches).css({'left':"52px"}); 
$(switches).parent().css({'background-position': "147px -37px"}); 
}})

來源

2011-05-17 03:51:51

實際上有一個專門用於選中框的選擇器。

$('fieldset input[type=checkbox]:checked').each(function(){ 
    var switches = $(this).parent().find('.switch'); 
    $(switches).attr('state','on') 
    $(switches).css({'left':'52px'}); 
    $(switches).parent().css({'background-position':'147px -37px'}); 
});

如果你使用它，你不必自己做任何邏輯。

來源

2011-05-17 03:53:02

jQuery選擇問題

回答

相關問題