Jquery 通过选择另一个复选框来选择所有复选框

大家好，我从jquery开始，当我试图通过单击另一个复选框来选择页面中的所有复选框时，遇到了一个问题

这是我的Jquery代码：

$('.selecionarTodos').live('click', function () {

        alert("test");

        var checkbox = $(this).children('td').children('[type="checkbox"]');

        $('.headerChkItem').each(function () {

            if (checkbox.is(':checked')) {
                $(this).css('background-color', '');
                checkbox.attr('checked', false);
                $(this).children('td').children('[id*="hfSelecionada"]').val('false');
                qtdTotal = qtdTotal - parseFloat($(this).children('.quantidade').text().replace(',', '.'));
            }
            else {
                $(this).css('background-color', '#e8f783');
                checkbox.attr('checked', true);
                $(this).children('td').children('[id*="hfSelecionada"]').val('true');
                qtdTotal = qtdTotal + parseFloat($(this).children('.quantidade').text().replace(',', '.'));
            }

        });
    });

这是我的客户端代码：

<asp:TemplateField HeaderText="Selecionar" ItemStyle-HorizontalAlign="Center">
  <HeaderTemplate>
   <input type="checkbox" id="headerChkItem" cssclass="selecionarTodos" runat="server" />
     </HeaderTemplate>
       <ItemTemplate>
   <input type="checkbox" id="chkItem" disabled="disabled" cssclass="selecionado" runat="server" />
       </ItemTemplate>
 </asp:TemplateField>

注：当我测试时，Jquery中的“警报”没有运行。

---

提前感谢。

您需要将其从

id=“headerChkItem”

更改为

class=“headerChkItem”

---

另外，

“cssclass”

是服务器端语言的一部分吗？或者应该是

“class”

？

我猜您的服务器代码（来自您的示例）看起来像这样：

<asp:ObjectDataSource runat="server" ID="DataSource" SelectMethod="GetData" TypeName="WebApplication1.Test"></asp:ObjectDataSource>
<asp:GridView runat="server" ID="Grid" DataSourceID="DataSource">
    <Columns>
        <asp:TemplateField HeaderText="Selecionar" ItemStyle-HorizontalAlign="Center">
            <HeaderTemplate>
                <input type="checkbox" class="selecionarTodos headerChkItem" runat="server" />
            </HeaderTemplate>
            <ItemTemplate>
                <input type="checkbox" disabled="disabled" class="selecionado chkItem" runat="server" />
            </ItemTemplate>
        </asp:TemplateField>            
    </Columns>
</asp:GridView>

$('.selecionarTodos').on('click', function () {
        var gridCheckboxes = $(this).parents('table').find('input:checkbox.chkItem');
        var qtdTotal = 0;

        if ($(this).is(':checked')) {
            $(this).css('background-color', '');
            gridCheckboxes.attr('checked', true);
            qtdTotal = qtdTotal - parseFloat($(this).children('.quantidade').text().replace(',', '.'));
        } else {
            $(this).css('background-color', '#e8f783');
            gridCheckboxes.attr('checked', false);
            qtdTotal = qtdTotal + parseFloat($(this).children('.quantidade').text().replace(',', '.'));
        }
    });

您的错误主要是：

• 当类是正确的时使用cssclass属性
• 表中的复选框选择错误

---

我仍然不明白为什么要在每个循环中使用所有标题复选框。我发布的代码只是位于标题复选框上，当您单击它时，网格中的所有其他复选框都将根据标题复选框的状态进行选中或取消选中。

好的，我已将cssclass更改为class，并且它已被执行，但现在我仍然必须通过单击此复选框来选择所有ITEN，我必须循环我的所有网格行？你能在客户端发布HTML而不是上面的服务器端代码吗？我看不到标签在哪里，等等。你把id改成类了吗？