javascript - 选择 GridView 中的所有复选框

Question

我有以下 GridView -

<asp:GridView ID="group_table" Runat="server" 
    AutoGenerateColumns="False" onprerender="group_table_PreRender" 
    onrowdatabound="group_table_RowDataBound"
    ClientIDMode="Static"  CellPadding="4" ForeColor="#333333" 
    GridLines="None" Width="915px" BorderStyle=Ridge >
    <AlternatingRowStyle BackColor="White" />

    <Columns>
    <asp:TemplateField ItemStyle-Width=90>
       <HeaderTemplate>
           <asp:CheckBox ID="selectAllCheckBox" runat="server" Text="Select all"/>
       </HeaderTemplate>
     <ItemTemplate>

       <asp:CheckBox ID="selectCheckBox" runat="server"/>


     </ItemTemplate>

  </asp:TemplateField>

并尝试实现以下 JavaScript 函数，以便当用户单击 selectAllCheckBox 时，所有复选框都会被选中 -

 $(document).ready(function() {

  var headerCheckbox = $('#group_table > tbody > tr > th > input:checkbox');

  headerCheckbox.click(function() {
     var headerChecked = $(this).attr('checked');
     var rowCheckboxes = $('#group_table > tbody > tr > td > input:checkbox');
     rowCheckboxes.attr('checked', headerChecked);
  }); 

}); 

但是由于某种原因这没有影响，我哪里出错了？

Answer 1

正如我对问题的评论中所述(您所说的是正确的)，您的 headerCheckbox 变量的选择器是错误的。表格标题位于 thead 中，而不是位于 tbody 中。试试这个:

var headerCheckbox = $("#group_table > thead > tr > th > input:checkbox");