禁用树视图节点

Question

我列出了 ASP.net 控件 TreeView 的数据。我想禁用列出的 TreeView 中的特定节点/父节点。我想用 jQuery 来做这个。

Answer 1

如果你采用简单的树节点标记：

<asp:TreeView runat="server" ID="myTreeView">
        <Nodes>
            <asp:TreeNode Text="Node 1 "/>                          
            <asp:TreeNode Text="Node 2"/>                           
            <asp:TreeNode Text="Node 3"/>                           
        </Nodes>
        <NodeStyle CssClass="treeNode" />
    </asp:TreeView>

那么单个节点的默认输出为：

<table cellspacing="0" cellpadding="0" style="border-width: 0pt;">
    <tbody><tr>
        <td><img alt="" src="/WebResource.axd?d=g57q362hyd_ZDMok5KQd0PqwW46aD7OdNOJZcZxqq5Q1&amp;t=634092817937234954"></td><td style="white-space: nowrap;" class="treeNode myTreeView_2"><a style="border-style: none; font-size: 1em;" id="myTreeViewt0" onclick="TreeView_SelectNode(myTreeView_Data, this,'myTreeViewt0');" href="javascript:__doPostBack('myTreeView','sNode 1 ')" class="myTreeView_0 treeNode myTreeView_1">Node 1 </a></td>
    </tr>
</tbody></table>

此时，您可以看到生成的 a 标签周围接收到 css 类“treeNode”，因此要选择特定节点，您可以使用以下选择器：

$('.treeNode:eq(0)') 获取树中的第一个节点。您可能更喜欢使用其他选择器，请参阅jQuery docs 上的选择器页面。

然后你可以做不同的事情。

• 你可以隐藏节点：

    $('.treeNode:eq(0)').hide();
  

您可以将 a 标签替换为文本：

      var node = $('.treeNode:eq(0)'); //get the node element
      var nodeLink = $('a', node).hide() //get the link and hide it;
      node.append(nodeLink.text()); //get the text from the link and add it to the node

或者您可以使用 3rd 方 jquery 插件来阻止元素（通常在执行 ajax 操作时很好）：

      - download the [blockui][2] plugin
      - reference the javascript file from your page (or masterpage)
      - then use this javascript call:
            to block:
                        $('.treeNode:eq(0)').block();
            unblock:
                         $('.treeNode:eq(0)').unblock();