使用JavaScript展开/折叠TreeView中所有节点

使用JavaScript展开/折叠TreeView中所有节点(Expand and Collapse All Nodes of asp.net Treeview on the client with javascript)

代码如下，国外网站上copy很多，也不知道谁才是原作者，但在.net 3.5下好像有一点毛病，就是图标的问题，不知道如何解决：

 

<% @ Page Language = " C# "  AutoEventWireup = " true "  CodeFile = " jstree.aspx.cs "  Inherits = " jstree "   %>

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head  runat ="server" >
     < title > Untitled Page </ title >

     < script  type ="text/javascript" >
    
     function  expandAll(treeViewId)
    {
          var  treeView  =  document.getElementById(treeViewId);
          var  treeLinks  =  treeView.getElementsByTagName( " a " );
          var  j  =   true ;
          for (i = 0 ;i < treeLinks.length;i ++ )
         {
               if (treeLinks[i].firstChild.tagName  ==   " IMG " )
              {
                 var  node  =  treeLinks[i];
                 var  level  =  parseInt(treeLinks[i].id.substr(treeLinks[i].id.length  -   1 ), 10 );
                 var  childContainer  =  document.getElementById(treeLinks[i].id  +   " Nodes " );
                
                if (j)
                {
                     if (childContainer.style.display  ==   " none " )
                    TreeView_ToggleNode(eval(treeViewId  + " _Data " ),level,node, ' r ' ,childContainer);
                    j  =   false ;
                }
                 else
                {
                     if (childContainer.style.display  ==   " none " )
                    TreeView_ToggleNode(eval(treeViewId  + " _Data " ),level,node, ' l ' ,childContainer);
                }
              }
          }
    }
    
    
     function  collapseAll(treeViewId)
    {
          var  treeView  =  document.getElementById(treeViewId);
          var  treeLinks  =  treeView.getElementsByTagName( " a " );
          var  j  =   true ;
          for (i = 0 ;i < treeLinks.length;i ++ )
         {
               if (treeLinks[i].firstChild.tagName  ==   " IMG " )
              {
                 var  node  =  treeLinks[i];
                 var  level  =  parseInt(treeLinks[i].id.substr(treeLinks[i].id.length  -   1 ), 10 );
                 var  childContainer  =  document.getElementById(treeLinks[i].id  +   " Nodes " );
                
                if (j)
                {
                     if (childContainer.style.display  ==   " block " )
                    TreeView_ToggleNode(eval(treeViewId  + " _Data " ),level,node, ' r ' ,childContainer);
                    j  =   false ;
                }
                 else
                {
                     if (childContainer.style.display  ==   " block " )
                    TreeView_ToggleNode(eval(treeViewId  + " _Data " ),level,node, ' l ' ,childContainer);
                }
              }
          }
   }
    
     function  Button1_onclick() {
        expandAll( ' <%=TreeView1.ClientID%> ' );
    }

     function  Button2_onclick() {
        collapseAll( ' <%=TreeView1.ClientID%> ' );
    }

     </ script >

</ head >
< body >
     < form  id ="form1"  runat ="server" >
     < div >
     </ div >
     < asp:TreeView  ID ="TreeView1"  runat ="server" >
         < Nodes >
             < asp:TreeNode  Text ="New Node"  Value ="New Node" >
                 < asp:TreeNode  Text ="New Node"  Value ="New Node" >
                     < asp:TreeNode  Text ="New Node"  Value ="New Node" >
                         < asp:TreeNode  Text ="New Node"  Value ="New Node" ></ asp:TreeNode >
                     </ asp:TreeNode >
                 </ asp:TreeNode >
                 < asp:TreeNode  Text ="New Node"  Value ="New Node" ></ asp:TreeNode >
                 < asp:TreeNode  Text ="New Node"  Value ="New Node" >
                     < asp:TreeNode  Text ="New Node"  Value ="New Node" >
                         < asp:TreeNode  Text ="New Node"  Value ="New Node" ></ asp:TreeNode >
                     </ asp:TreeNode >
                 </ asp:TreeNode >
                 < asp:TreeNode  Text ="New Node"  Value ="New Node" ></ asp:TreeNode >
                 < asp:TreeNode  Text ="New Node"  Value ="New Node" ></ asp:TreeNode >
                 < asp:TreeNode  Text ="New Node"  Value ="New Node" >
                     < asp:TreeNode  Text ="New Node"  Value ="New Node" ></ asp:TreeNode >
                 </ asp:TreeNode >
             </ asp:TreeNode >
         </ Nodes >
     </ asp:TreeView >
     </ form >
     < p >
         < input  id ="Button1"  type ="button"  value ="Expand All"  onclick ="return Button1_onclick()"   /></ p >
     < p >
         < input  id ="Button2"  type ="button"  value ="Collapse All"  onclick ="return Button2_onclick()"   /></ p >
</ body >
</ html >

作者：Lance Zhang（Lance Zhang's Tech Blog）
出处：http://blodfox777.cnblogs.com/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。