Bootstrap 3 - 手动将活动类分配给标题导航项目答案

【问题标题】：Bootstrap 3 - manually asigning active class to to header nav itemsBootstrap 3 - 手动将活动类分配给标题导航项目
【发布时间】：2013-11-03 04:11:15
【问题描述】：

我在 wordpress 中使用 nav walker 进行引导。

我在菜单下的管理面板中添加了一个自定义导航项。该自定义项有 3 个子页面，当我转到该自定义项下的其中一个页面时，页面链接突出显示并且“活动”类适用，但我希望自定义导航项或父导航项也处于活动状态。

我该怎么做？

我尝试了下面的代码，但这不起作用

<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   if (currentLocation == "media-gallery/pictures"){
      $("#menu-item-140").addClass("active");
   }
});
</script>

【问题讨论】：

标签： javascript php css wordpress twitter-bootstrap

【解决方案1】：

<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   alert(currentLocation);
   // if (currentLocation == "media-gallery/pictures"){
   //    $("#menu-item-140").addClass("active");
   // }
});
</script>


<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   // alert(currentLocation);
   if (currentLocation == "/media-gallery/pictures"){
      $("#menu-item-140").addClass("active");
   }
});
</script>

编辑：

澄清一下，假设您的文件位于http://example.com/test/blank.php，此代码已经过全面测试并且可以正常工作。请注意前导斜线。

<style>
    .active{
        background-color: red;
    }
</style>

<div id="menu-item-140">Make me red</div>

<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   alert(currentLocation);
   if (currentLocation == "/test/blank.php"){
      $("#menu-item-140").addClass("active");
   }
});
</script>

【讨论】：

对不起，它不起作用。我提醒我的网址并使用该网址激活但不起作用...
PS：您可能也需要 .php 扩展名 - 请查看
我正在使用 wordpress 先生
不用担心，它应该仍然可以工作。你能分享你正在谈论的确切网址吗？现在我仔细观察，我想确认“#menu-item-140”是您想要影响的“目标”“父导航”？
#menu-item-140 是顶部主导航下的动态导航项。在此之下，我在下拉菜单中有 3 页。