Microsfot.Web.UI.WebControls.TreeView JavaScript控制方法研究

舊文

Microsfot.Web.UI.WebControls.TreeView JavaScript控制方法研究

caidaoli@hotmail.com 2003-11-26

1. 被選擇的節點的索引：
   tree.selectedNodeIndex

2. 被單擊的節點的索引：
   tree.clickedNodeIndex

3. 擷取一個節點：
   tree.getTreeNode(nodeIndex)

4. 在根節點下增加一個子節點：
   var tree = document.all['TreeView1'];
   var node = tree.createTreeNode() ;
   tree.add(node);
   node.setAttribute( "text", "aaaa");

5. 在當前節點下增加一個子節點：
   var tree = document.all['TreeView1'];
   var node = tree.createTreeNode() ;
   var parentNode = tree.getTreeNode( tree.clickedNodeIndex);
   parentNode.add(node);
   node.setAttribute( "text", "aaaa");

6. 通過XML檔案來增加子節點：
   node.setAttribute("NavigateUrl","xxx");
   node.databind();
7. 動態增加子節點後自動延伸：
   node.setAttribute('expanded', 'true');//MS提供的HTC中需要修改一個地方，否則就會產生一個異常
8. 擷取節點的屬性：
   node.getAttribute("xxx")
9. 設定節點的屬性 ：
   node.setAttribute('xxx', 'xxxx');
10. 常用屬性列表：
    

    屬性	值	含義
    CheckBox	True False	是否有選擇框
    checked	True False	選擇框是否被選中
    Expanded	True False	是否展開
    ImageURL		正常狀態下左邊的表徵圖
    SelectedImageUrl		當節點被選擇時左邊的表徵圖
    ExpandedImageUrl		當節點被展開後左邊的表徵圖
    Target		目標框架
    navigateurl		目標URL
    type		節點的類型
    childtype		子節點的類型
    Text		節點顯示的文本
    innerText
    innerHTML
    defaultstyle		預設的風格
    hoverstyle		當滑鼠移到節點的上面時的風格
    selectedstyle		當節點被選擇時的風格
    treenodesrc

11. 擷取父節點：
    node.getParent()
12. 擷取子節點：
    node.getChildren()
13. 判斷節點是否有子節點
    node.getChildren().length > 0
14. 響應onselectedindexchange事件：
    var tree = document.all["tvMain"];
    tree.attachEvent("onselectedindexchange", SelectedIndexChange);