jquery - 我如何使用 jquery 在 asp.net treeview 中检查叶节点的开/关

Question

我有一个树视图，其中有几个节点及其根节点下的子节点。我为每个节点启用了复选框。我需要的是当用户检查父节点时，应该检查该节点下的所有子节点（类似于取消选中）。我想使用 JQuery 来实现这一点。

任何帮助是极大的赞赏。

感谢您分享您的时间和智慧。

Answer 1

您可以尝试以下操作，取自asteranup 的 回答：

<form id="form1" runat="server">
    <asp:TreeView ID="LinksTreeView" Font-Name="Arial" ForeColor="Blue" InitialExpandDepth="2"
        ShowCheckBoxes="Parent,Leaf" runat="server">
        <LevelStyles>
            <asp:TreeNodeStyle ChildNodesPadding="10" Font-Bold="true" Font-Size="12pt" ForeColor="DarkGreen" />
            <asp:TreeNodeStyle ChildNodesPadding="5" Font-Bold="true" Font-Size="10pt" />
            <asp:TreeNodeStyle ChildNodesPadding="5" Font-Underline="true" Font-Size="10pt" />
            <asp:TreeNodeStyle ChildNodesPadding="10" Font-Size="8pt" />
        </LevelStyles>
        <Nodes>
            <asp:TreeNode Text="Table of Contents" SelectAction="None">
                <asp:TreeNode Text="Chapter One">
                    <asp:TreeNode Text="Section 1.0">
                        <asp:TreeNode Text="Topic 1.0.1" />
                        <asp:TreeNode Text="Topic 1.0.2" />
                        <asp:TreeNode Text="Topic 1.0.3" />
                    </asp:TreeNode>
                    <asp:TreeNode Text="Section 1.1">
                        <asp:TreeNode Text="Topic 1.1.1" />
                        <asp:TreeNode Text="Topic 1.1.2" />
                        <asp:TreeNode Text="Topic 1.1.3" />
                        <asp:TreeNode Text="Topic 1.1.4" />
                    </asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Chapter Two">
                    <asp:TreeNode Text="Section 2.0">
                        <asp:TreeNode Text="Topic 2.0.1" />
                        <asp:TreeNode Text="Topic 2.0.2" />
                    </asp:TreeNode>
                </asp:TreeNode>
            </asp:TreeNode>
            <asp:TreeNode Text="Appendix A" />
            <asp:TreeNode Text="Appendix B" />
            <asp:TreeNode Text="Appendix C" />
        </Nodes>
    </asp:TreeView>
  </form>

Javascript：

$(document).ready(function() {
    ("div[id $= LinksTreeView] input[type=checkbox]").click(function() {           
        $(this).closest("table").next("div").find("input[type=checkbox]").attr("checked", this.checked);
    });
});