複選框選擇所有切換功能

Question

我有多個複選框，第一個複選框的值是全選。我的jQuery代碼是

$(".checkboxFilter input:checkbox:first").change().toggle(function() { 
     alert("inside first toggle"); 
     $(".checkboxFilter").find(':checkbox').prop("checked", true); 
    }, function() { 
     alert("inside second toggle"); 
     $(".checkboxFilter").find(':checkbox').prop("checked", false); 
    }); 

的問題是，當我渲染頁面，默認情況下，選擇所有按鈕被選中，但沒有其他的選項被選中。當我再次點擊選擇所有複選框時，它會選擇所有，當我單擊全選按鈕時，它會取消選擇全部，但全選按鈕仍然保持選中狀態。任何人都可以幫我

Answer 1

請勿使用toggle，只需change即可使用。看看這個

工作demo

$(".checkboxFilter input:checkbox:first").change(function() { 
     $(".checkboxFilter").find(':checkbox').prop("checked", this.checked); 
}); 

Answer 2

你應該設置「全選」的默認狀態爲未勾選或全部勾選。