檢查/ uncehck checkboxlist與jquery

Question

我在網上看到的大多數例子都有一個片段，他們使用2個複選框，其中一個僅用於一個複選框（全部），另一個用於複選框列表。在myy的情況下，我只有一個checkboxlist綁定到數據源，例如我的數據源列表選項是（全部，蘋果，橙色，紅色，藍色），我得到了大部分的工作，除非一切都未選中，我檢查最後一個項目，例如藍色它會檢查ALL選項。所以不能正常工作。 id是「所有」項目列表中的

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
$(document).ready(function() { 
    var id = "#<%=cbOptions.ClientID %>_0"; 
    var checkboxlistid = "#<%= cbOptions.ClientID %>"; 
    $(id).click(function() { 
     $("#<%= cbOptions.ClientID %> input:checkbox").attr('checked', this.checked); 
    }); 
    $(checkboxlistid + " input:checkbox").click(function() { 
     if ($(checkboxlistid).attr('value') != 0) { 
      if ($(id).attr('checked') == true && this.checked == false) { 
       $(id).attr('checked', false); 
      } 
      else { 
       if ($(id).attr('checked') == true && this.checked == true) 
        CheckSelectAll(); 
      } 

     } 
    }); 
    function CheckSelectAll() { 
     var flag = true; 
     $(checkboxlistid + " input:checkbox").each(function() { 
      if ($(checkboxlistid).attr('value') != 0) { 
       if (this.checked == false) { 
        flag = false; 
       } 
       else { 
        if ($(id).attr('checked') == true && this.checked == false) { 
         flag = false; 
        } 
        else { 
         flag = true; 
        } 
       } 
      } 
     }); 

     $(id).attr('checked', flag); 
    } 
     });  
     </script> 
       <asp:CheckBoxList runat="server" ID="cbOptions" > 
       </asp:CheckBoxList> 
     </asp:Content> 

Answer 1

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      var id = "#<%=cbOptions.ClientID %>_0"; 
      var checkboxlistid = "#<%= cbOptions.ClientID %>"; 
      $(id).click(function() { 
       $("#<%= cbOptions.ClientID %> input:checkbox").attr('checked', this.checked); 
      }); 
      $(checkboxlistid + " input:checkbox").click(function() { 
      if ($(id).attr('checked') == true && this.checked == false) { 
       $(id).attr('checked', false); 
      } 
      else 
       CheckSelectAll(); 
      }); 
      function CheckSelectAll() { 
       $(checkboxlistid + " input:checkbox").each(function() { 
        var checkedcount = $(checkboxlistid + " input[type=checkbox]:checked").length; 
       var checkcondition = $(checkboxlistid + " input[type=checkbox]:").length - 1 
       if (checkedcount >= checkcondition) 
        $(id).attr('checked', true); 
       else 
        $(id).attr('checked', false); 
       }); 
      } 
     });  
     </script> 
       <asp:CheckBoxList runat="server" ID="cbOptions" > 
       </asp:CheckBoxList> 
     </asp:Content> 

Answer 2

的ID試試這個代碼爲您的設置檢查，而不是分別使用true和false使用檢查和「」屬性..更多了，你不能有相同的ID所有的複選框.id的都是獨一無二的..如果你對所有複選框使用相同的id，那麼它根本就不起作用。如果這樣做它作爲類名稱，並使用$(.classname)選擇

function CheckSelectAll() { 
      var flag = "checked"; 
      $(checkboxlistid + " input:checkbox").each(function() { 
       if ($(checkboxlistid).attr('value') != 0) { 
        if (this.checked == false) { 
         flag = ''; 
        } 
        else { 
         if ($(id).attr('checked') == true && this.checked == false) { 
          flag = ''; 
         } 
         else { 
          flag = "checked"; 
         } 
        } 
       } 
      }); 

      $(id).attr('checked', flag); 
     } 
      });