Bootstrap导航栏激活状态

Question

我正在使用Bootstrap的导航栏，但是每当我点击一个页面标题时，导航栏不会突出显示它以显示我在该页面上。例如，如果我在主页上，则导航栏如下所示：
然而，如果我点击“关于”，我进入“关于”页面，但导航栏仍然像这样：
如何使导航栏突出显示所在页面？谢谢

- Richard

Answer 1

阅读 文档。您需要将 class="active" 应用于您想要激活的 li 元素。它不会自动处理。您需要根据自己的需求实现它。

这可以是 JQuery 解决方案或服务器端解决方案。取决于您的网站构建方式，其中一个可能更或更少合适。

- Dmitry Efimenko

---

从设计和编码的角度来看，哪种更好？做一个jQuery还是PHP的解决方案？感谢您的帮助。 - Richard

服务器端解决方案通常更可靠，因此更合适。 - Dmitry Efimenko

Answer 2

我正在使用MVC4、Razor和Bootstrap，最终采用了coderwall.com的一种解决方案（https://coderwall.com/p/hwtkng）。

<li @if (@ViewContext.RouteData.GetRequiredString("controller") == "Home") { @Html.AttributeEncode("class=active");}>
                        @Html.ActionLink("Home", "Index", "Home")
                    </li>

- fanvabra

---

好的提示。我可能会补充一下，如果你和我一样需要检查操作而不是控制器，下面的代码片段将会做到：<li @if (ViewContext.RouteData.GetRequiredString("action") == "Index") { @Html.AttributeEncode("class=active");}>@Html.ActionLink("主页", "Index", "Home")</li> <li @if (ViewContext.RouteData.GetRequiredString("action") == "About") { @Html.AttributeEncode("class=active");}>@Html.ActionLink("关于我们", "About", "Home")</li> - Mackan