【摘抄】如何高亮ASP.NET MENU 的父节点

原文地址：http://www.codeproject.com/KB/webforms/AspMenuParentHighlighting.aspx

最近有几个客户问我如何高亮ASP.NET MENU的父节点，我就google了一把，找到了这篇文章，感觉不错，故搬了过来。

看看效果先，

刚刚又搜索了下，以前好像有人在博客园里发过了，那就直接参考他的吧，

http://www.cnblogs.com/forward/archive/2008/01/26/1054604.html

Posted on 2008-01-26 22:12 foward.molly.宝儿阅读(304) 评论(1) 编辑收藏网摘

今天偶逛CodeProject，又发现个好东东，另一种实现父菜单选中的方法，之前找到过一个，CSSAdapters(http://www.asp.net/cssadapters)的方法，这个又是一种，都很经典的说

这个新的方式也很不错
我将sample code留下来，以后也会记得，嘿嘿原文: http://www.codeproject.com/KB/webforms/AspMenuParentHighlighting.aspx

使用js来实现的，恩，页面会有太多的js，如果菜单很多，那么应该也会很慢的应该，性能考量不见的比上面那个CSSAdapters的好，CSSAdapter配置确实要麻烦很多不过

html

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4

<html xmlns="http://www.w3.org/1999/xhtml">
6

<head id="Head1" runat="server">
7

<title>Untitled Page</title>
8

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

function UnhoverParents(id, parentSnake)
23

{
24

Menu_Unhover(document.getElementById(id));
25

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

</div>
85

</form>
86

</body>
87

</html>
88

code behind

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

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

List<MenuItem> list = new List<MenuItem>();
22

list.Add(mainMenu.Items[0]);
23

FindMenuItems(mainMenu.Items[0], list);
24

foreach (MenuItem mi in list)
26

{
27

List<MenuItem> parents = new List<MenuItem>();
28

FindParents(mi, parents);
29

string parentSnake = String.Empty;
31

foreach (MenuItem parent in parents)
32

{
33

parentSnake += "mainMenun" + list.IndexOf(parent).ToString() + ",";
34

}
35

parentSnake.TrimEnd(',');
37

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

ScriptManager.RegisterStartupScript(this, typeof(string), "MenuHoverUnhover", script, true);
43

}
44

void FindMenuItems(MenuItem mi, List<MenuItem> list)
46

{
47

foreach (MenuItem child in mi.ChildItems)
48

{
49

list.Add(child);
50

}
51

foreach (MenuItem child in mi.ChildItems)
53

{
54

FindMenuItems(child, list);
55

}
56

}
57

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

void mainMenu_MenuItemClick(object sender, MenuEventArgs e)
71

{
72

MessageLabel.Text = e.Item.Text;
73

}
74

}

posted @ 2009-03-19 11:44 海洋——海纳百川,有容乃大. 阅读(473) 评论(0) 收藏举报

刷新页面返回顶部

宇宙教父

【摘抄】如何高亮ASP.NET MENU 的父节点

公告