请帮我解决这个问题。 下面是我的导航栏。我使用Bootstrap 3作为导航栏。 如何将活动类添加到当前列表锚标记,并在下拉菜单中将活动类添加到父列表锚标记。 下面是我的html,css和js文件。 请指导我解决我的问题。
//dropdown menu
$('.nav_bar_custom .drop_menu1').hover(function() {
$(this).children('ul').stop(true, false, true).slideToggle(300);
});
var path = window.location.pathname.split("/").pop();
if ( path == '' ) {
path = 'index.php';
}
var target = $('nav .nav_bar_custom li a[href="'+path+'"]');
target.addClass('active_menu');

.navigation{
background: #304269;
}
.nav li a{ color: #fff;}
nav li{
display: inline-block;
float: left;
}
.nav li .drop_menu2 li{
display: block;
float: none;
}
nav ul li a.active_menu {
color: #0BADEE;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="navigation clearfix" id="navigation">
<nav>
<ul class="nav navbar-nav navbar-right nav_bar_custom">
<li>
<a href="index.php">Home</a>
</li>
<li class="drop_menu1">
<a href="training.php">Training</a>
<ul class="drop_menu2" id="drop_menuT" style="display: none;">
<li>
<a href="basic.php">Basic</a>
</li>
<li>
<a href="intermediate.php">Intermediate</a>
</li>
<li>
<a href="advance.php">Advance</a>
</li>
</ul>
</li>
<li>
<a href="blog.php">Blog</a>
</li>
<li>
<a href="contact.php">Contact</a>
</li>
</ul>
</nav>
</div>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
答案 0 :(得分:0)
请使用以下脚本:
<script>
var path = 'basic'; //Dynamic value using PHP
var target = $("a[href$='"+path+"']");
target.addClass('active_menu');
target.parent().parent().parent().find('a:first').addClass('active_menu');
</script>