如何在 ASP.NET 4 中更改菜单项的呈现答案

【问题标题】：How to change the rendering of a Menu Item in ASP.NET 4如何在 ASP.NET 4 中更改菜单项的呈现
【发布时间】：2012-11-07 10:22:31
【问题描述】：

我不想将菜单项的图像呈现为锚中的标记，而是向锚标记添加一个类，该类将图像添加为背景图像。

目前，我正在使用搜索图像 url 的 javascript 进行一些后期处理。如果找到，它们将被删除并替换为 CSS 类。

有没有办法通过覆盖 Menu 或实现 MenuAdapter 来执行此操作？
我看过 MenuAdapter 类，但看起来我必须重新实现所有渲染功能才能改变这个小部分。

[注意：我这样做的原因是因为我想在文本之后显示图像；我很难使用默认渲染来做到这一点。]

预计到达时间：在下面回答。

【问题讨论】：

标签： asp.net menu adapter menuitem

【解决方案1】：

我发现最简单的方法是覆盖Menu 的Render 方法。

使用此菜单，您可以在菜单项的 ToolTip 属性中放置工具提示和 css 类，用分号分隔：
item.ToolTip = "this is the tip; class1 class2";

注意：这是一个简单的菜单，可以按照我的意愿执行。它会忽略 ImageUrl 和 SeparatorImageUrl。

public class CSSItemMenu : Menu
    {

        protected override void Render(HtmlTextWriter writer)
        {
            this.PerformDataBinding();

            writer.Write(string.Format("<div id=\"{0}\" class=\"{1}\">", base.ClientID, base.CssClass));
            writer.WriteLine();
            writer.WriteLine("<ul class=\"level1\">");

            foreach (MenuItem item in Items)
            {
                WriteItem(writer, item, 1);
            }

            writer.WriteLine("</ul>");
            writer.WriteLine("</div>");
        }

        private static void WriteItem(HtmlTextWriter writer, MenuItem item, int level)
        {
            writer.WriteLine("<li>");

            string title = "";
            var userClass = "";
            if (!string.IsNullOrEmpty(item.ToolTip))
            {
                var data = item.ToolTip.Split(';');
                title = string.Format(" title=\"{0}\"", data[0].Trim());
                if (data.Length > 1)
                {
                    userClass = " " + data[1].Trim();
                }
            }
            var cssClass = string.Format("class = \"popout level{0}{1}\"", level, userClass);

            writer.WriteLine(string.Format("<a {0} href=\"{1}\"{2}>{3}</a>", cssClass, item.NavigateUrl, title, item.Text));

            if (item.ChildItems.Count > 0)
            {
                writer.WriteLine(string.Format("<ul class=\"level{0}\">", level + 1));
                foreach (MenuItem child in item.ChildItems)
                {
                    WriteItem(writer, child, level + 1);
                }
                writer.WriteLine("</ul>");
            }

            writer.WriteLine("</li>");
        }

    }

【讨论】：