0

ASPチェックボックスリストですべてを選択する次のコードがあります。

    <script type="text/javascript">
        $(document).ready(function () {
            $('.myCheckBoxList :checkbox').eq(0).click(function () {
                var cbl = document.getElementById('<%=cbl_list1.ClientID %>').getElementsByTagName("input");
                // If Checked
                if (this.checked) {
                    for (i = 0; i < cbl.length; i++)
                        cbl[i].checked = true;
                }
                // If Unchecked
                else {
                    for (i = 0; i < cbl.length; i++)
                        cbl[i].checked = false;
                }
            });
        });
    </script>

        <asp:CheckBoxList ID="cbl_list1" runat="server" AppendDataBoundItems="true" CssClass="myCheckBoxList" >
            <asp:ListItem Text="Select All" Value="Select All" />
            <asp:ListItem Text="1" Value="1" />
            <asp:ListItem Text="2" Value="2" />
            <asp:ListItem Text="3" Value="3" />
        </asp:CheckBoxList>

同じコードを使用する複数のチェック ボックス リストを追加したいと考えています。クライアント ID を js にハードコーディングせずに継承するにはどうすればよいですか (つまり、getElementById('<%=cbl_list1.ClientID %>'))

4

4 に答える 4

2

を使用thisして、コードで行ったように現在の要素を参照し、他の要素をトラバースできます。

$('.myCheckBoxList :checkbox:first').click(function() {
    $(this).siblings().prop('checked', this.checked);
});
于 2013-07-16T18:49:00.650 に答える
1

複数のチェック ボックス リストの場合は、each functionこの方法を使用できます。使用する必要はありませんid。次に、checkbox使用している要素を見つけてfind更新します

例：

$('.myCheckBoxList').each(function() {
    var el = $(this);
    el.find('input[type="checkbox"]:eq(0)').change(function() {
        if (el.prop('checked')) {
            el.find('input[type="checkbox"]').not(':eq(0)').prop('checked', true);
        } else {
            el.find('input[type="checkbox"]').not(':eq(0)').prop('checked', false);
        }
    });
});
于 2013-07-16T18:57:21.993 に答える