如何高亮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

 

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

这个新的方式也很不错
我将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
 3 <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
 4
 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

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
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
21        List<MenuItem> list = new List<MenuItem>();
22        list.Add(mainMenu.Items[0]);
23        FindMenuItems(mainMenu.Items[0], list);
24
25        foreach (MenuItem mi in list)
26        {
27            List<MenuItem> parents = new List<MenuItem>();
28            FindParents(mi, parents);
29
30            string parentSnake = String.Empty;
31            foreach (MenuItem parent in parents)
32            {
33                parentSnake += "mainMenun" + list.IndexOf(parent).ToString() + ",";
34            }
35
36            parentSnake.TrimEnd(',');
37
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
42        ScriptManager.RegisterStartupScript(this, typeof(string), "MenuHoverUnhover", script, true);
43    }
44
45    void FindMenuItems(MenuItem mi, List<MenuItem> list)
46    {
47        foreach (MenuItem child in mi.ChildItems)
48        {
49            list.Add(child);
50        }
51
52        foreach (MenuItem child in mi.ChildItems)
53        {
54            FindMenuItems(child, list);
55        }
56    }
57
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
70    void mainMenu_MenuItemClick(object sender, MenuEventArgs e)
71    {
72        MessageLabel.Text = e.Item.Text;
73    }
74}