本文實例為大家分享了treeview使用方法，供大家參考，具體內容如下
1.所需文件：ftiens4.js,ua.js,XMLTree.js,以及一些樹上的圖片（文件下載處：http://www.treeview.net/），圖片名字和位置如下圖
2.其他頁面（MainContent.aspx,NavTree.aspx）放置位置如下圖所示:
3.關鍵頁面的代碼
3.1 MainContent.aspx代碼
<%@ Page Language="C#" CodeFile="MainContent.aspx.cs" Inherits="mainContent" %><!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>北京市城市軌道交通設施運行狀態監測系統</title> <link rel="Shortcut Icon" href="Resources/Images/iehead.ico" /> <link rel="Bookmark" href="Resources/Images/iehead.ico" /> <script type="text/javascript"> function op() { // This function is for folders that do not open pages themselves. // See the online instructions for more information. } </script></head> <frameset cols="250,10,*" border="0" frameSpacing="0" frameBorder="no" id="tree_frm"> <frame src="navTree.Aspx" name="treeframe" noResize> <frame src="treeControl.htm" name="ctr_frm" id="ctr_frm" noResize scrolling="no"> <frame src="#" name="mainGisWindow" id="basefrm" noResize> </frameset></html>3.2 NavTree.aspx代碼
<%@ Page Language="C#" CodeFile="NavTree.aspx.cs" Inherits="navTree" %><html ><head runat="server"> <title>北京市城市軌道交通設施運行狀態監測系統</title> <script src="Resources/JS/Tree/ua.js" type="text/javascript" language="javascript"></script> <!-- Infrastructure code for the TreeView. DO NOT REMOVE. --> <script src="Resources/JS/Tree/ftiens4.js" type="text/javascript" language="javascript"></script> <!-- Scripts that define the tree. DO NOT REMOVE. --><script src="Resources/JS/Tree/XMLTree.js" type="text/javascript" language="javascript"></script> <% //Common.Utility.WebUtility.validLoning(Session, Response); string fileName = null; //Bussiness.Login.User loginUser = (Bussiness.Login.User)Session["currentUser"]; string departmentid = ""; if (Session["navItem"] != null) { string item = (string)Session["navItem"]; if (item.ToUpper().Equals("Safety".ToUpper())) { fileName = "'SafetyTree.xml'"; //departmentid = loginUser.department.depId; } else if (item.ToUpper().Equals("Gis".ToUpper())) { fileName = "'GisTree.xml'"; } else if (item.ToUpper().Equals("DataQuality".ToUpper())) { fileName = "'DataQualityTree.xml'"; } else if (item.ToUpper().Equals("StateAnalysis".ToUpper())) { fileName = "'StateAnalysisTree.xml'"; } else if (item.ToUpper().Equals("SynthesisTechnique".ToUpper())) { fileName = "'SynthesisTechniqueTree.xml'"; } else if (item.ToUpper().Equals("DataMaintenance".ToUpper())) { fileName = "'DataMaintenanceTree.xml'"; } } %><script type="text/javascript"> var xmlfile = "Resources/XML/Tree/"+<%=fileName %>; departmentid= '<%=departmentid %>'; ICONPATH = 'Resources/Images/tree/'; contentFrame = window.parent.document.getElementByIdx_x_x("basefrm"); loadTreeFromXml(xmlfile);</script> <style> BODY { background-image:url(/ESM/Resources/Images/DapHangNew.jpg); background-repeat:repeat-x; } TD { font-size: 10pt; font-family: verdana,helvetica; text-decoration: none; white-space:nowrap;} A { text-decoration: none; color: black; } .specialClass { font-family:garamond; font-size:10pt; color:Black; font-weight:lighter; text-decoration:underline } </style></head><body topmargin="16" marginheight="16"> <!-------------------------------------------------------------> <!-- IMPORTANT NOTICE: --> <!-- Removing the following link will prevent this script --> <!-- from working. Unless you purchase the registered --> <!-- version of TreeView, you must include this link. --> <!-- If you make any unauthorized changes to the following --> <!-- code, you will violate the user agreement. If you want --> <!-- to remove the link, see the online FAQ for instructions --> <!-- on how to obtain a version without the link. --> <!-------------------------------------------------------------><!--下面的一定不能刪，刪了就會有問題--><DIV style="position:absolute; top:0; left:0; display:none;"><TABLE border=0><TR><TD><FONT size=-2><A style="font-size:7pt;text-decoration:none;color:silver" target=_blank>Javascript Tree Menu</A></FONT></TD></TR></TABLE></DIV> <!-- Build the browser's objects and display default view --> <!-- of the tree. --> <script> initializeDocument(); </script></body></html>3.3 treeControl.aspx代碼（它的作用就是樹和右邊頁面的分隔欄，可以隱藏樹）
<!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><title></title> <script type="text/javascript" language="javascript"> var LEFT_MENU_VIEW=1; function leftmenu_ctrl() { if(LEFT_MENU_VIEW==0) { parent.tree_frm.cols="250,10,*"; LEFT_MENU_VIEW=1; myarrow.src="/ESM/Resources/Images/topleft.gif"; //左箭頭 } else { parent.tree_frm.cols="0,10,*"; LEFT_MENU_VIEW=0; myarrow.src="/ESM/Resources/Images/topright.gif"; //右箭頭 } } </script></head><body style="background-color:#F1F8FC;"> <div id="AdLayer" style="position:absolute;width:60px; height:21px; z-index:20;visibility:visible;left:0%; top:40%;"> <div id="oa_tree" onclick="leftmenu_ctrl();" title="隱藏工具欄" style="cursor:pointer;"><img id="myarrow" src="/ESM/Resources/Images/topleft.gif" alt="" /></div> </div></body></html>[over]
這樣就成了。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持武林網。
新聞熱點
疑難解答
