我想在我的导航中添加一些类答案

【问题标题】：I want to add some classes to my nav我想在我的导航中添加一些类
【发布时间】：2016-05-21 21:44:34
【问题描述】：

我将.selected 用于顶部导航，.active 用于子导航

<div class="nav-collapse collapse navbar-collapse navbar-responsive-collapse">
<ul class="nav navbar-nav uppercase col-md-10">
    <li class="dropdown dropdown-fw open selected">
        <a href="javascript:;"><i class="icon-home"></i> Dashboard</a>
        <ul class="dropdown-menu dropdown-menu-fw">
            <li class="active"><a href="http://www.example.com/dashboard">Dashboard</a></li>
        </ul>
    </li>
    <li class="dropdown dropdown-fw">
        <a href="javascript:;"><i class="icon-puzzle"></i>example</a>
        <ul class="dropdown-menu dropdown-menu-fw">
            <li class="disabled"><a href="#">example1</a></li>
            <li><a href="http://www.example.com/2">example2</a></li>
            <li class="disabled"><a href="#">Sexample3</a></li>
            <li><a href="http://www.example.com/4">example4</a></li>
        </ul>
    </li>
</ul>

我想要的是当我单击并重定向到另一个页面时，我希望 javascript 检测页面的 url 并激活导航栏中包含与 url 相同的 href 值的链接 + 将所选类添加到 .dropdown-menu-fw 的父级

var url = window.location;
console.log(url);
$('.dropdown-menu-fw li a[href="'+ url +'"]').parent().addClass('active');
$('.dropdown-menu-fw li a').filter(function() {
return this.href == url;
}).parent().addClass('active');

【问题讨论】：

标签： javascript jquery html css navigation

【解决方案1】：

也许你的意思是 var url = window.location.href; 而不是 .location？这样就可以检索到整个 URL。

.location 检索对象。

【讨论】：

【解决方案2】：

这对我有用

$(document).ready(function(){
var url = window.location.href;

$('.dropdown-menu-fw li').removeClass('active');
$('.dropdown-menu-fw li a').filter(function() {
    return this.href == url;
}).parent().addClass('active');

$('.dropdown-fw').removeClass('selected open');
$('.dropdown-menu-fw li a[href="'+ url+'"]').closest(".dropdown-fw").addClass('open selected');
// $('.dropdown-menu-fw li a').parentsUntil(".dropdown-fw").addClass('open');
});

【讨论】：