[jQuery]判斷 checkbox 是否選取,實現全選跟全部取消

在 jQuery 底下要如何實現這個功能,其實還蠻簡單的,首先看 html 部份

<input name="user_active_col[]" type="checkbox" value="1"> 1
<input name="user_active_col[]" type="checkbox" value="2"> 2
<input name="user_active_col[]" type="checkbox" value="3"> 3
<input name="user_active_col[]" type="checkbox" value="4"> 4
<input name="user_active_col[]" type="checkbox" value="5"> 5
<input name="clickAll" id="clickAll" type="checkbox"> 全選

jQuery 部份如下:

$("#clickAll").click(function() {
   if($("#clickAll").prop("checked")) {
     $("input[name='user_active_col[]']").each(function() {
         $(this).prop("checked", true);
     });
   } else {
     $("input[name='user_active_col[]']").each(function() {
         $(this).prop("checked", false);
     });           
   }
});

可以不用 loop 方式,直接用一行解取代上面程式碼

$("input[name='user_active_col[]']").prop("checked", true);
  • NK

    我覺得判斷式可以縮短成這樣,給你參考看看~
    var IsChk = ($(“#clickAll”).attr(“checked”));
    $(“input[@name=’user_active_col[]’]”).each(function(){$(this).attr(“checked”, IsChk);});

  • 樓上解法不錯,簡短許多

  • 感覺很實用!但是現在都1.8.3版了…

  • appleboy48

    Yes, 現在的版本請改用 prop 的方式取代 attr 了。

  • 過客

    爲何要用 .each(…) ?
    直接設定全部checkbox 不可以嗎?
    $(“input[name=’user_active_col[]’]”).prop(“checked”, true);

  • 湯包

    var ck = $(“input[name=’ckAll’]”).prop(“checked”);
    $(“input[name=’user_ck[]’]”).prop(“checked”,ck);
    這樣0.0