一个IEWebControl TreeView右键菜单的例子,实现了添加、修改和删除功能,复制即可运行
更多TreeView的客户端操作参见
http://www.csdn.net/Develop/read_article.asp?id=22100
1@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls, Version=1.0.2.226, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
1<html>
2<head>
3<title>TreeView控件右键菜单</title>
4<style>
5<!--
6.skin
7{
8cursor:default;
9font:menutext;
10position:absolute;
11text-align:left;
12font-family: Arial, Helvetica, sans-serif;
13font-size: 10pt;
14width:120px;
15background-color:menu;
16border:1 solid buttonface;
17visibility:hidden;
18border:2 outset buttonhighlight;
19}
20.menuitems
21{
22padding-left:15px;
23padding-right:10px;
24}
25\-->
26</style>
27</head>
28<body onclick="hideMenu()">
29<form id="TreeView" method="post" runat="server">
30<iewc:treeview expandlevel="3" hoverstyle="color:blue;background:#ffff00;" id="TreeView1" runat="server">
31<iewc:treenode expanded="True" text="Node0">
32<iewc:treenode text="Node3">
33<iewc:treenode text="Node5"></iewc:treenode>
34<iewc:treenode text="Node6"></iewc:treenode>
35</iewc:treenode>
36<iewc:treenode text="Node4"></iewc:treenode>
37</iewc:treenode>
38<iewc:treenode expanded="True" text="Node1">
39<iewc:treenode text="Node7">
40<iewc:treenode text="Node8"></iewc:treenode>
41</iewc:treenode>
42</iewc:treenode>
43<iewc:treenode expanded="True" text="Node2">
44<iewc:treenode text="Node9"></iewc:treenode>
45<iewc:treenode text="Node10">
46<iewc:treenode text="Node11"></iewc:treenode>
47<iewc:treenode text="Node12"></iewc:treenode>
48</iewc:treenode>
49</iewc:treenode>
50</iewc:treeview>
51<div class="skin" id="popupMenu" onclick="clickItem()" onmouseout="lowlightItem()" onmouseover="highlighItem()">
52<div class="menuitems" func="add">添加</div>
53<hr/>
54<div class="menuitems" func="delete">删除</div>
55<div class="menuitems" func="modify">修改</div>
56</div>
57</form>
58<script language="javascript">
59var menuskin = "skin";
60var node = null;
61
62function hideMenu()
63{
64popupMenu.style.visibility = "hidden";
65}
66
67function highlighItem()
68{
69if (event.srcElement.className == "menuitems")
70{
71event.srcElement.style.backgroundColor = "highlight";
72event.srcElement.style.color = "white";
73}
74}
75
76function lowlightItem()
77{
78if (event.srcElement.className == "menuitems")
79{
80event.srcElement.style.backgroundColor = "";
81event.srcElement.style.color = "black";
82window.status = "";
83}
84}
85
86function clickItem()
87{
88if (event.srcElement.className == "menuitems")
89{
90if(event.srcElement.getAttribute("func") == "add" && node != null)
91{
92var newNode=TreeView1.createTreeNode();
93newNode.setAttribute("Text","new Node");
94node.add(newNode);
95}
96else if (event.srcElement.getAttribute("func") == "delete" && node != null)
97{
98node.remove();
99}
100else if (event.srcElement.getAttribute("func") == "modify" && node != null)
101{
102node.setAttribute("Text","hgknight");
103}
104}
105}
106
107function TreeView1.oncontextmenu()
108{
109var nodeindex = event.treeNodeIndex;
110if (typeof(nodeindex) == "undefined")
111{
112node = null;
113return;
114}
115
116node = TreeView1.getTreeNode(nodeindex);
117
118var rightedge = document.body.clientWidth-event.clientX;
119var bottomedge = document.body.clientHeight-event.clientY;
120if (rightedge <popupMenu.offsetWidth)
121{
122popupMenu.style.left = document.body.scrollLeft + event.clientX - popupMenu.offsetWidth;
123}
124else
125{
126popupMenu.style.left = document.body.scrollLeft + event.clientX;
127}
128if (bottomedge <popupMenu.offsetHeight)
129{
130popupMenu.style.top = document.body.scrollTop + event.clientY - popupMenu.offsetHeight;
131}
132else
133{
134popupMenu.style.top = document.body.scrollTop + event.clientY;
135}
136popupMenu.style.visibility = "visible";
137return false;
138}
139
140</script>
141</body>
142</html>