这个新的方式也很不错
我将sample code留下来,以后也会记得,嘿嘿 原文: http://www.codeproject.com/KB/webforms/AspMenuParentHighlighting.aspx
使用js来实现的,恩,页面会有太多的js,如果菜单很多,那么应该也会很慢的应该,性能考量不见的比上面那个CSSAdapters的好,CSSAdapter配置确实要麻烦很多不过
html
1
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
2![](/Images/OutliningIndicators/None.gif)
3
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4![](/Images/OutliningIndicators/None.gif)
5
<html xmlns="http://www.w3.org/1999/xhtml">
6
<head id="Head1" runat="server">
7
<title>Untitled Page</title>
8
<script type="text/javascript">
9
function HoverParents(id, parentSnake)
10
{
11
Menu_HoverDynamic(document.getElementById(id));
12
var parents = parentSnake.toString().split(',');
13
for(i = 0;i < parents.length;i++)
14
{
15
if(parents[i] != '')
16
{
17
Menu_HoverDynamic(document.getElementById(parents[i]));
18
}
19
}
20
}
21
22
function UnhoverParents(id, parentSnake)
23
{
24
Menu_Unhover(document.getElementById(id));
25
26
var parents = parentSnake.toString().split(',');
27
for(i = 0;i < parents.length;i++)
28
{
29
if(parents[i] != '')
30
{
31
Menu_Unhover(document.getElementById(parents[i]));
32
}
33
}
34
}
35
</script>
36
</head>
37
<body>
38
<form id="form1" runat="server">
39
<div>
40
<asp:ScriptManager ID="sm" runat="server" />
41
<asp:UpdatePanel ID="up" runat="server">
42
<ContentTemplate>
43
<asp:Menu ID="mainMenu" runat="server"
44
StaticMenuItemStyle-CssClass="MenuItem"
45
StaticHoverStyle-CssClass="MenuItemHover"
46
StaticSelectedStyle-CssClass="MenuItemSelected"
47
StaticPopOutImageUrl="~/Images/PopOut.png"
48
DynamicPopOutImageUrl="~/Images/PopOut.png"
49
DynamicMenuItemStyle-CssClass="DynamicMenuItem"
50
DynamicHoverStyle-CssClass="MenuItemHover"
51
StaticSubMenuIndent="0"
52
StaticDisplayLevels="2"
53
>
54
<Items>
55
<asp:MenuItem Text="Music">
56
<asp:MenuItem Text="Classical" />
57
<asp:MenuItem Text="Rock">
58
<asp:MenuItem Text="Electric" />
59
<asp:MenuItem Text="Acoustical" />
60
<asp:MenuItem Text="Classical4" />
61
<asp:MenuItem Text="Rock4">
62
<asp:MenuItem Text="Electric4" />
63
<asp:MenuItem Text="Acoustical4" />
64
</asp:MenuItem>
65
</asp:MenuItem>
66
<asp:MenuItem Text="Classical2" />
67
<asp:MenuItem Text="Rock2">
68
<asp:MenuItem Text="Electric2">
69
<asp:MenuItem Text="Classical3" />
70
<asp:MenuItem Text="Rock3">
71
<asp:MenuItem Text="Electric3" />
72
<asp:MenuItem Text="Acoustical3" />
73
</asp:MenuItem>
74
</asp:MenuItem>
75
<asp:MenuItem Text="Acoustical5" />
76
</asp:MenuItem>
77
</asp:MenuItem>
78
</Items>
79
</asp:Menu>
80
<asp:Label id="MessageLabel" runat="server" />
81
</ContentTemplate>
82
</asp:UpdatePanel>
83
84
</div>
85
</form>
86
</body>
87
</html>
88![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
2
![](/Images/OutliningIndicators/None.gif)
3
![](/Images/OutliningIndicators/None.gif)
4
![](/Images/OutliningIndicators/None.gif)
5
![](/Images/OutliningIndicators/None.gif)
6
![](/Images/OutliningIndicators/None.gif)
7
![](/Images/OutliningIndicators/None.gif)
8
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
9
![](/Images/OutliningIndicators/InBlock.gif)
10
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
11
![](/Images/OutliningIndicators/InBlock.gif)
12
![](/Images/OutliningIndicators/InBlock.gif)
13
![](/Images/OutliningIndicators/InBlock.gif)
14
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
15
![](/Images/OutliningIndicators/InBlock.gif)
16
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
17
![](/Images/OutliningIndicators/InBlock.gif)
18
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
19
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
20
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
21
![](/Images/OutliningIndicators/InBlock.gif)
22
![](/Images/OutliningIndicators/InBlock.gif)
23
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
24
![](/Images/OutliningIndicators/InBlock.gif)
25
![](/Images/OutliningIndicators/InBlock.gif)
26
![](/Images/OutliningIndicators/InBlock.gif)
27
![](/Images/OutliningIndicators/InBlock.gif)
28
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
29
![](/Images/OutliningIndicators/InBlock.gif)
30
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
31
![](/Images/OutliningIndicators/InBlock.gif)
32
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
33
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
34
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
35
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
36
![](/Images/OutliningIndicators/None.gif)
37
![](/Images/OutliningIndicators/None.gif)
38
![](/Images/OutliningIndicators/None.gif)
39
![](/Images/OutliningIndicators/None.gif)
40
![](/Images/OutliningIndicators/None.gif)
41
![](/Images/OutliningIndicators/None.gif)
42
![](/Images/OutliningIndicators/None.gif)
43
![](/Images/OutliningIndicators/None.gif)
44
![](/Images/OutliningIndicators/None.gif)
45
![](/Images/OutliningIndicators/None.gif)
46
![](/Images/OutliningIndicators/None.gif)
47
![](/Images/OutliningIndicators/None.gif)
48
![](/Images/OutliningIndicators/None.gif)
49
![](/Images/OutliningIndicators/None.gif)
50
![](/Images/OutliningIndicators/None.gif)
51
![](/Images/OutliningIndicators/None.gif)
52
![](/Images/OutliningIndicators/None.gif)
53
![](/Images/OutliningIndicators/None.gif)
54
![](/Images/OutliningIndicators/None.gif)
55
![](/Images/OutliningIndicators/None.gif)
56
![](/Images/OutliningIndicators/None.gif)
57
![](/Images/OutliningIndicators/None.gif)
58
![](/Images/OutliningIndicators/None.gif)
59
![](/Images/OutliningIndicators/None.gif)
60
![](/Images/OutliningIndicators/None.gif)
61
![](/Images/OutliningIndicators/None.gif)
62
![](/Images/OutliningIndicators/None.gif)
63
![](/Images/OutliningIndicators/None.gif)
64
![](/Images/OutliningIndicators/None.gif)
65
![](/Images/OutliningIndicators/None.gif)
66
![](/Images/OutliningIndicators/None.gif)
67
![](/Images/OutliningIndicators/None.gif)
68
![](/Images/OutliningIndicators/None.gif)
69
![](/Images/OutliningIndicators/None.gif)
70
![](/Images/OutliningIndicators/None.gif)
71
![](/Images/OutliningIndicators/None.gif)
72
![](/Images/OutliningIndicators/None.gif)
73
![](/Images/OutliningIndicators/None.gif)
74
![](/Images/OutliningIndicators/None.gif)
75
![](/Images/OutliningIndicators/None.gif)
76
![](/Images/OutliningIndicators/None.gif)
77
![](/Images/OutliningIndicators/None.gif)
78
![](/Images/OutliningIndicators/None.gif)
79
![](/Images/OutliningIndicators/None.gif)
80
![](/Images/OutliningIndicators/None.gif)
81
![](/Images/OutliningIndicators/None.gif)
82
![](/Images/OutliningIndicators/None.gif)
83
![](/Images/OutliningIndicators/None.gif)
84
![](/Images/OutliningIndicators/None.gif)
85
![](/Images/OutliningIndicators/None.gif)
86
![](/Images/OutliningIndicators/None.gif)
87
![](/Images/OutliningIndicators/None.gif)
88
![](/Images/OutliningIndicators/None.gif)
code behind
1
using System;
2
using System.Collections.Generic;
3
using System.Configuration;
4
using System.Data;
5
using System.Linq;
6
using System.Web;
7
using System.Web.Security;
8
using System.Web.UI;
9
using System.Web.UI.HtmlControls;
10
using System.Web.UI.WebControls;
11
using System.Web.UI.WebControls.WebParts;
12
using System.Xml.Linq;
13![](/Images/OutliningIndicators/None.gif)
14
public partial class _Default : System.Web.UI.Page
15
{
16
protected void Page_Load(object sender, EventArgs e)
17
{
18
mainMenu.MenuItemClick += new MenuEventHandler(mainMenu_MenuItemClick);
19
string script = String.Empty;
20![](/Images/OutliningIndicators/InBlock.gif)
21
List<MenuItem> list = new List<MenuItem>();
22
list.Add(mainMenu.Items[0]);
23
FindMenuItems(mainMenu.Items[0], list);
24![](/Images/OutliningIndicators/InBlock.gif)
25
foreach (MenuItem mi in list)
26
{
27
List<MenuItem> parents = new List<MenuItem>();
28
FindParents(mi, parents);
29![](/Images/OutliningIndicators/InBlock.gif)
30
string parentSnake = String.Empty;
31
foreach (MenuItem parent in parents)
32
{
33
parentSnake += "mainMenun" + list.IndexOf(parent).ToString() + ",";
34
}
35![](/Images/OutliningIndicators/InBlock.gif)
36
parentSnake.TrimEnd(',');
37![](/Images/OutliningIndicators/InBlock.gif)
38
script += "document.getElementById('" + mainMenu.ClientID + "n" + list.IndexOf(mi).ToString() + "').onmouseover = function(){HoverParents('" + mainMenu.ClientID + "n" + list.IndexOf(mi).ToString() + "', '" + parentSnake + "')};";
39
script += "document.getElementById('" + mainMenu.ClientID + "n" + list.IndexOf(mi).ToString() + "').onmouseout = function(){UnhoverParents('" + mainMenu.ClientID + "n" + list.IndexOf(mi).ToString() + "', '" + parentSnake + "')};";
40
}
41![](/Images/OutliningIndicators/InBlock.gif)
42
ScriptManager.RegisterStartupScript(this, typeof(string), "MenuHoverUnhover", script, true);
43
}
44![](/Images/OutliningIndicators/InBlock.gif)
45
void FindMenuItems(MenuItem mi, List<MenuItem> list)
46
{
47
foreach (MenuItem child in mi.ChildItems)
48
{
49
list.Add(child);
50
}
51![](/Images/OutliningIndicators/InBlock.gif)
52
foreach (MenuItem child in mi.ChildItems)
53
{
54
FindMenuItems(child, list);
55
}
56
}
57![](/Images/OutliningIndicators/InBlock.gif)
58
void FindParents(MenuItem mi, List<MenuItem> list)
59
{
60
if (mi.Parent != null)
61
{
62
if (mi.Parent != mainMenu.Items[0])
63
{
64
list.Add(mi.Parent);
65
FindParents(mi.Parent, list);
66
}
67
}
68
}
69![](/Images/OutliningIndicators/InBlock.gif)
70
void mainMenu_MenuItemClick(object sender, MenuEventArgs e)
71
{
72
MessageLabel.Text = e.Item.Text;
73
}
74
}
75![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
2
![](/Images/OutliningIndicators/None.gif)
3
![](/Images/OutliningIndicators/None.gif)
4
![](/Images/OutliningIndicators/None.gif)
5
![](/Images/OutliningIndicators/None.gif)
6
![](/Images/OutliningIndicators/None.gif)
7
![](/Images/OutliningIndicators/None.gif)
8
![](/Images/OutliningIndicators/None.gif)
9
![](/Images/OutliningIndicators/None.gif)
10
![](/Images/OutliningIndicators/None.gif)
11
![](/Images/OutliningIndicators/None.gif)
12
![](/Images/OutliningIndicators/None.gif)
13
![](/Images/OutliningIndicators/None.gif)
14
![](/Images/OutliningIndicators/None.gif)
15
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
16
![](/Images/OutliningIndicators/InBlock.gif)
17
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
18
![](/Images/OutliningIndicators/InBlock.gif)
19
![](/Images/OutliningIndicators/InBlock.gif)
20
![](/Images/OutliningIndicators/InBlock.gif)
21
![](/Images/OutliningIndicators/InBlock.gif)
22
![](/Images/OutliningIndicators/InBlock.gif)
23
![](/Images/OutliningIndicators/InBlock.gif)
24
![](/Images/OutliningIndicators/InBlock.gif)
25
![](/Images/OutliningIndicators/InBlock.gif)
26
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
27
![](/Images/OutliningIndicators/InBlock.gif)
28
![](/Images/OutliningIndicators/InBlock.gif)
29
![](/Images/OutliningIndicators/InBlock.gif)
30
![](/Images/OutliningIndicators/InBlock.gif)
31
![](/Images/OutliningIndicators/InBlock.gif)
32
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
33
![](/Images/OutliningIndicators/InBlock.gif)
34
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
35
![](/Images/OutliningIndicators/InBlock.gif)
36
![](/Images/OutliningIndicators/InBlock.gif)
37
![](/Images/OutliningIndicators/InBlock.gif)
38
![](/Images/OutliningIndicators/InBlock.gif)
39
![](/Images/OutliningIndicators/InBlock.gif)
40
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
41
![](/Images/OutliningIndicators/InBlock.gif)
42
![](/Images/OutliningIndicators/InBlock.gif)
43
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
44
![](/Images/OutliningIndicators/InBlock.gif)
45
![](/Images/OutliningIndicators/InBlock.gif)
46
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
47
![](/Images/OutliningIndicators/InBlock.gif)
48
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
49
![](/Images/OutliningIndicators/InBlock.gif)
50
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
51
![](/Images/OutliningIndicators/InBlock.gif)
52
![](/Images/OutliningIndicators/InBlock.gif)
53
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
54
![](/Images/OutliningIndicators/InBlock.gif)
55
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
56
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
57
![](/Images/OutliningIndicators/InBlock.gif)
58
![](/Images/OutliningIndicators/InBlock.gif)
59
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
60
![](/Images/OutliningIndicators/InBlock.gif)
61
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
62
![](/Images/OutliningIndicators/InBlock.gif)
63
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
64
![](/Images/OutliningIndicators/InBlock.gif)
65
![](/Images/OutliningIndicators/InBlock.gif)
66
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
67
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
68
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
69
![](/Images/OutliningIndicators/InBlock.gif)
70
![](/Images/OutliningIndicators/InBlock.gif)
71
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
72
![](/Images/OutliningIndicators/InBlock.gif)
73
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
74
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
75
![](/Images/OutliningIndicators/None.gif)