Question

有更好的方法吗？

我有一个HTML帮助扩展方法，用于检查当前选项卡菜单是否为所选选项卡，然后选择.selected css class。我把每个li中的html.IsSelected链接作为

<li class="<%=Html.IsSelected(string a, string b)%>" >

其中a是选项卡名称，b是ViewData分配。

这是干净还是有更好的方法？

Answer 1

我在我的一个项目中使用这种方法并且工作得很好。我在每个控制器中分配了ViewData [“Home”] =“activeTab”类，并在视图中使用空字符串的默认值，如下所示。如果获取该viewData字典的值，这将使选项卡处于活动状态。简单而且非常干净。

您的家庭控制器将如下所示：

        ViewData["Home"] = "activeTab";

        return View("Index");
    }

视图将如下所示：

<li class="<%= ((string)ViewData["Home"] ?? "") %>"><%= Html.ActionLink("Home", "Index", "Home")%></li>
<li class="<%= ((string)ViewData["About"] ?? "") %>"><%= Html.ActionLink("About", "About", "Home")%></li>

Answer 2

您还可以查看之前的建议：

An easy way to set the active tab using controllers and a user control in ASP.NET MVC?

Answer 3

如果您可以使用javascript解决方案，请查看jQuery UI Accordion插件如何处理此问题。基本上，您可以通过在加载页面时检查请求URL来选择基于控制器的突出显示的选项卡。

或者，您可以为每个选项卡设置一个与选项卡的类值对应的ViewBag项。将当前选项卡的值设置为活动的css类，将其他值设置为空（或其默认值）。然后你可以使用：

<li id="HomeTab" class="<%= ViewBag.HomeTabClass %>" />
<li id="OtherTab" class="<%= (string)ViewBag.OtherTabClass %>" />

在控制器中，您将为ViewData变量设置正确的值。

ViewBag.HomeTabClass = "tab activeTab";
ViewBag.OtherTabClass = "tab";

Answer 4

我试图让这个没有运气。

你的CSS是什么样的？我在下面。

.activeTab { 背景：#FFFFFF; 颜色：＃000000; }

我在主页上使用它而不是主视图，不确定这是否影响它。

asp.net mvc和css：选择时突出显示菜单选项卡

4 个答案: