jQuery未能通過編程取消選中複選框

Question

簡單的功能，我想根據更改頂層複選框切換選中/取消選中複選框。

問題是切換/點擊事件處理程序有固有的問題。如果您嘗試將這些處理程序綁定到輸入複選框，則該框的默認檢查行爲將失敗。

因此，我嘗試以兩種不同方式之一使用Change處理程序。

 $('input.all_neighborhoods').change(function(){ 
    if($(this).not(':checked')){ 
     $(this).closest('li').siblings('li').find('input[name=neighborhood_id]').attr('checked','checked'); 
    } 
    else{ 
     $(this).closest('li').siblings('li').find('input[name=neighborhood_id]').removeAttr('checked'); 
    } 

    }); 

在這裏，第一次更改按照您的預期工作。所有兄弟複選框都被選中並檢查。但是，當我再次點擊取消選中時，什麼都不會發生。事件處理程序不起作用。

然後我嘗試這樣做：

$('input.all_neighborhoods').change(function(){ 
    $(this).attr('checked', $(this).is(':checked') ? $(this).closest('li').siblings('li').find('input[name=neighborhood_id]').attr('checked','checked'): $(this).removeAttr('checked').closest('li').siblings('li').find('input[name=neighborhood_id]').removeAttr('checked')); 
}); 

在這裏，兄弟複選框有效切換。但是，主開關複選框保持選中狀態。

這裏的問題與他們是否都是兄弟姐妹有關，而主複選框不是父級？

Answer 1

（警告，無恥的自我推銷提前）。我已經寫了一個jQuery插件，爲您處理所有這些混亂。沒有必要重新發明輪子。

檢查出來：http://mjball.github.com/jQuery-CheckAll/

---

如果你想堅持使用當前的方法，這裏是如何解決這個問題：

$('input.all_neighborhoods').change(function() { 
    $(this).closest('li') 
     .siblings('li') 
     .find('input[name=neighborhood_id]').attr('checked', this.checked); 
} 

只是傳遞一個布爾值，.attr()。此外，由於每When to use Vanilla JavaScript vs. jQuery?不使用

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

而是使用

this.checked 

這是更少的字符寫的，不需要任何jQuery的，並且是方式更有效。