TreeView右键菜单实例

一个IEWebControl TreeView右键菜单的例子，实现了添加、修改和删除功能，复制即可运行
更多TreeView的客户端操作参见
http://www.csdn.net/Develop/read_article.asp?id=22100 

<% @ Register TagPrefix = " iewc "  Namespace = " Microsoft.Web.UI.WebControls "  Assembly = " Microsoft.Web.UI.WebControls, Version=1.0.2.226, Culture=neutral, PublicKeyToken=31bf3856ad364e35 "   %>  
< HTML >  
< HEAD >  
< title > TreeView控件右键菜单 </ title >  
< style >  
<!--  
.skin 
... { 
cursor:default; 
font:menutext; 
position:absolute; 
text-align:left; 
font-family: Arial, Helvetica, sans-serif; 
font-size: 10pt; 
width:120px; 
background-color:menu; 
border:1 solid buttonface; 
visibility:hidden; 
border:2 outset buttonhighlight; 
}  
.menuitems 
... { 
padding-left:15px; 
padding-right:10px; 
}  
-->  
</ style >  
</ HEAD >  
< body onclick = " hideMenu() " >  
< form id = " TreeView "  method = " post "  runat = " server " >  
< iewc:TreeView id = " TreeView1 "  runat = " server "  ExpandLevel = " 3 "  HoverStyle = " color:blue;background:#ffff00; " >  
< iewc:TreeNode Text = " Node0 "  Expanded = " True " >  
< iewc:TreeNode Text = " Node3 " >  
< iewc:TreeNode Text = " Node5 " ></ iewc:TreeNode >  
< iewc:TreeNode Text = " Node6 " ></ iewc:TreeNode >  
</ iewc:TreeNode >  
< iewc:TreeNode Text = " Node4 " ></ iewc:TreeNode >  
</ iewc:TreeNode >  
< iewc:TreeNode Text = " Node1 "  Expanded = " True " >  
< iewc:TreeNode Text = " Node7 " >  
< iewc:TreeNode Text = " Node8 " ></ iewc:TreeNode >  
</ iewc:TreeNode >  
</ iewc:TreeNode >  
< iewc:TreeNode Text = " Node2 "  Expanded = " True " >  
< iewc:TreeNode Text = " Node9 " ></ iewc:TreeNode >  
< iewc:TreeNode Text = " Node10 " >  
< iewc:TreeNode Text = " Node11 " ></ iewc:TreeNode >  
< iewc:TreeNode Text = " Node12 " ></ iewc:TreeNode >  
</ iewc:TreeNode >  
</ iewc:TreeNode >  
</ iewc:TreeView >  
< div id = " popupMenu "   class = " skin "  onMouseover = " highlighItem() "  onMouseout = " lowlightItem() "  onClick = " clickItem() " >  
< div  class = " menuitems "  func = " add " > 添加 </ div >  
< hr >  
< div  class = " menuitems "  func = " delete " > 删除 </ div >  
< div  class = " menuitems "  func = " modify " > 修改 </ div >  
</ div >  
</ form >  
< script language = " javascript " >  
var menuskin  =   " skin " ; 
var node  =   null ; 

function hideMenu() 
... { 
popupMenu.style.visibility = "hidden"; 
}  

function highlighItem() 
... { 
if (event.srcElement.className == "menuitems") 
...{ 
event.srcElement.style.backgroundColor = "highlight"; 
event.srcElement.style.color = "white"; 
} 
}  

function lowlightItem() 
... { 
if (event.srcElement.className == "menuitems") 
...{ 
event.srcElement.style.backgroundColor = ""; 
event.srcElement.style.color = "black"; 
window.status = ""; 
} 
}  

function clickItem() 
... { 
if (event.srcElement.className == "menuitems") 
...{ 
if(event.srcElement.getAttribute("func") == "add" && node != null) 
...{ 
var newNode=TreeView1.createTreeNode(); 
newNode.setAttribute("Text","new Node"); 
node.add(newNode); 
} 
else if (event.srcElement.getAttribute("func") == "delete" && node != null) 
...{ 
node.remove(); 
} 
else if (event.srcElement.getAttribute("func") == "modify" && node != null) 
...{ 
node.setAttribute("Text","hgknight"); 
} 
} 
}  

function TreeView1.oncontextmenu() 
... { 
var nodeindex = event.treeNodeIndex; 
if (typeof(nodeindex) == "undefined") 
...{ 
node = null; 
return; 
} 

node = TreeView1.getTreeNode(nodeindex); 

var rightedge = document.body.clientWidth-event.clientX; 
var bottomedge = document.body.clientHeight-event.clientY; 
if (rightedge <popupMenu.offsetWidth) 
...{ 
popupMenu.style.left = document.body.scrollLeft + event.clientX - popupMenu.offsetWidth; 
} 
else 
...{ 
popupMenu.style.left = document.body.scrollLeft + event.clientX; 
} 
if (bottomedge <popupMenu.offsetHeight) 
...{ 
popupMenu.style.top = document.body.scrollTop + event.clientY - popupMenu.offsetHeight; 
} 
else 
...{ 
popupMenu.style.top = document.body.scrollTop + event.clientY; 
} 
popupMenu.style.visibility = "visible"; 
return false; 
}  

</ script >  
</ body >  
</ HTML >