建立3个web页面,MainWeb.aspx, LeftTree.aspx, RightMain.aspx.
其中,MainWeb是容器,里面放置了2个Iframe,分别用来存放TreeView的导航页(LeftTree.aspx) 和右边的内容页(RightMain.aspx)。
MainWeb.aspx的前台代码:
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>首页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<center>
<h1>电话簿</h1>
</center>
<table border="0" width="100%" cellpadding="0" class="main-table">
<tr>
<td align="Left" style="23%">
<iframe id="LeftTree" name="LeftTree" src="LeftTree.aspx" class="inset-table" width="300" height="600"></iframe>
</td>
<td align="left" style="75%">
<iframe id="RightMain" name="RightMain" src="RightMain.aspx" class="outset-table" width="100%" height="600" align="middle"></iframe>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
TreeView导航页面LeftTree.aspx的前台代码:
注意设置节点的Target为要显示到的Iframe,NavigateUrl为要显示的页面地址。
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>目录</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>功能列表</td>
</tr>
<tr>
<td>
<asp:TreeView ID="TreeView1" runat="server" Target="RightMain">
<Nodes>
<asp:TreeNode Text="功能" Value="功能" Expanded="True" SelectAction="SelectExpand">
<asp:TreeNode Text="联系人管理" Value="联系人管理" Expanded="False" SelectAction="Expand" Target="RightMain">
<asp:TreeNode Text="添加联系人" Value="添加联系人" NavigateUrl="~/Web/AddPerson.aspx" Target="RightMain"></asp:TreeNode>
<asp:TreeNode Text="查找编辑联系人" Value="查找编辑联系人" NavigateUrl="~/Web/FindPerson.aspx" Target="RightMain"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="分组管理" Value="分组管理" Expanded="False" SelectAction="Expand" Target="RightMain">
<asp:TreeNode Text="添加分组" Value="添加分组" NavigateUrl="~/Web/Default.aspx" Target="RightMain"></asp:TreeNode>
<asp:TreeNode Text="修改分组" Value="修改分组" NavigateUrl="~/Web/Default.aspx" Target="RightMain"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>