將類別“活動”添加到菜單

Question

我有一個側邊欄，並且我嘗試使用Javascript來更改外觀以及單擊時的目標頁面。 但是我沒有運氣就嘗試了很多建議，我也不明白為什么。

的jsfiddle

我嘗試使用此JS代碼：

$(document).ready(function () {
     var url = window.location;
     $('.navigation ul li a[href="'+url+'"]').parent().addClass('active');
});

但是，一旦添加了href="~/~"屬性，我將獲得一個"Unknown Command: [Link in href]" -並且"active"類未添加到該元素。

謝謝你的時間

Answer 1

您正在嘗試使用window.location獲取當前頁面的URL。 但是， window.location實際上是一個對象，包含多個屬性，並且不是當前頁面URL的字符串。 您將要使用window.location屬性之一，最有可能使用window.location.pathname 。 但是，請參閱https://developer.mozilla.org/zh-CN/docs/Web/API/Location，以獲取完整的選項列表。

Answer 2

對於您的代碼，您需要將url設置為var url = window.location.host+window.location.path';

Answer 3

嘗試這個，

var url = window.location;
// Will only work if string in href matches with location
$('.navigation ul li a[href="'+ url +'"]').parent().addClass('active');

// Will also work for relative and absolute hrefs
$('.navigation ul li a').filter(function() {
    return this.href == url;
}).parent().addClass('active');