Question

有没有办法在不使用任何js文件的情况下选择所有复选框。每当我使用jquery 1.8.3或jquery 1.7.2时都要这样做。我的其他js文件没有运行或者可能是由于他们没有运行的某些问题。所以，我在gridview中有复选框，我想执行检查所有选项。

 <asp:GridView Width="96%" HeaderStyle-HorizontalAlign="left" ID="gridimages" Font-Size="13px" HeaderStyle-Font-Size="15px" runat="server"  OnSorting="gridimages_Sorting" AutoGenerateColumns="false" AllowSorting="true" CssClass="grid gridimages" HeaderStyle-BorderColor="#D0D0D0" AlternatingRowStyle-BorderColor="#D0D0D0" RowStyle-BorderColor="#D0D0D0" OnRowDataBound="gridimages_RowDataBound" AllowPaging="true" PageSize="50" PagerSettings-Mode="NumericFirstLast" OnPageIndexChanging="gridimages_PageIndexChanging" CellPadding="3" BorderColor="#D0D0D0" BorderStyle="Groove" BorderWidth="1px" OnSelectedIndexChanged="gridimages_SelectedIndexChanged" GridLines="both">
        <AlternatingRowStyle BackColor="White" ForeColor="#284775"/>
     <%--   <RowStyle HorizontalAlign="Center" />--%>
        <Columns>

            <asp:TemplateField HeaderStyle-Width="20px" HeaderStyle-Font-Size="14px" HeaderStyle-ForeColor="Black">
          <HeaderTemplate>
            <asp:CheckBox ID="chkSelectAll" class="checkAll" runat="server" Text="" onclick="SelectAllCheckboxes(this);"  />
        </HeaderTemplate>
                <ItemTemplate>      <div style="text-align: left;">
                   <asp:HiddenField ID="hdn_id" runat="server" Value='<%#Eval("Id") %>' />

                    <asp:CheckBox ID="CheckBoxImage" CssClass="CheckBoxImage1"  onClick="CheckBoxImage();" runat="server" /></div>
                </ItemTemplate>
            </asp:TemplateField>

javascript代码：

           function SelectAllCheckboxes(chk) {
        var gvcheck = document.getElementById('<%= gridimages.ClientID %>');
        var i;
        //Condition to check header checkbox selected or not if that is true checked all checkboxes
        if (chk.checked) {
            for (i = 0; i < gvcheck.rows.length; i++) {
                var inputs = gvcheck.rows[i].getElementsByTagName('input');
                inputs[0].checked = true;
            }
        }
            //if condition fails uncheck all checkboxes in gridview
        else {
            for (i = 0; i < gvcheck.rows.length; i++) {
                var inputs = gvcheck.rows[i].getElementsByTagName('input');
                inputs[0].checked = false;
            }
        }
    }

查看javascript代码。我在var输入中遇到问题。我想在var输入中使用CheckBoxImage的id但不能这样做。我需要在var输入行中更改以获取checkboximae的id。请帮忙。

Answer 1

请不要使用jquery。使用与您的任何文件都不冲突的普通javascript。

检查此答案，以便按普通js的类型选择元素 accessing-elements-by-type-on-javascript

循环遍历这些元素时，可以为每个元素使用属性.checked = true。

Answer 2

使用纯javascript。

<强> HTML

<input type="checkbox" id="checkall" /><br />
<input type="checkbox" class="check" />
<input type="checkbox" class="check" />
<input type="checkbox" class="check" />
<input type="checkbox" class="check" />

<强>的Javascript

var chkAll = document.getElementById("checkall");
chkAll.addEventListener('click', function(e) {
    setCheck(this.checked);
});

function setCheck(value) {
    var items = document.getElementsByTagName("input");
    var itemLen = items.length;
    for (i = 0; i < itemLen; i++) {
        if (items[i].getAttribute("class") == "check") {
            items[i].checked = value;
        }
    }
}

演示代码：jsfiddle

Javascript文件覆盖另一个javascript文件

2 个答案: