TreeView 无刷新展开与收缩

1.当然有一个TreeView咯,这里ID名为 treeViewType

< asp:TreeView ID = " treeViewType "  runat = " server "  ExpandDepth = " 1 " ></ asp:TreeView >

 

2.然后需要两个按钮,其中 TreeviewExpandCollapseAll 为JS方法,后面介绍

< input type = " button "  value = " 展开 "   class = " but1 "  onclick = " TreeviewExpandCollapseAll('<%=treeViewType.ClientID%>', true) "   />
< input type = " button "  value = " 收缩 "   class = " but1 "  onclick = " TreeviewExpandCollapseAll('<%=treeViewType.ClientID%>', false) "   />

 

3.最关键的JS方法来了,嘿嘿

/*
* 树展开收缩方法 2010-03-23 PM By WQY
* treeViewId: 树对象
* expandAll: 展开或收缩
*/
function TreeviewExpandCollapseAll(treeViewId, expandAll) {
    var displayState 
=  (expandAll  ==   true   ?   " none "  :  " block " );
    var treeView 
=  document.getElementById(treeViewId);
    
if  (treeView) {
        var treeLinks 
=  treeView.getElementsByTagName( " a " );
        var nodeCount 
=  treeLinks.length;

        
for  (i  =   0 ; i  <  nodeCount; i ++ ) {
            
if  (treeLinks[i].firstChild.tagName) {
                
if  (treeLinks[i].firstChild.tagName.toLowerCase()  ==   " img " ) {
                    var currentToggleLink 
=  treeLinks[i];
                    var childContainer 
=  GetParentByTagName( " table " , currentToggleLink).nextSibling;
                    
if  (childContainer.style.display  ==  displayState) {
                        eval(currentToggleLink.href);
                    }
                }
            }
        }
    }
}

function GetParentByTagName(parentTagName, childElementObj) {
    var parent 
=  childElementObj.parentNode;
    
while  (parent.tagName.toLowerCase()  !=  parentTagName.toLowerCase()) {
        parent 
=  parent.parentNode;
    }
    
return  parent;
}

 

你可能感兴趣的:(treeview)