如何基於URL添加“活動”類？

Question

當用戶單擊側邊欄中的鏈接時，該鏈接應帶有下划線，以提醒他們在哪里。 我正在嘗試使用jQuery將“活動”類添加到錨點（如果它們在相應頁面上）。 這是到目前為止我得到的：

var pathy = $(location).attr('pathname');
pathy.val().replace(/\\/g, '');
if(pathy == $('#sidebar ul li a').text) {
    $(this).addClass('active');
} 
else {
}

不用說，它真的行不通。 我應該用php代替嗎？

Answer 1

嘗試這個：

$('#sidebar ul li a').each(function() {
    if ($(this).text() == pathy) {
        $(this).addClass('active');
    }
});

我對regex並不是最好的選擇，因此請確保首先返回您的值以確保它應該/不應該匹配。

編輯 -在下面的評論之后

看來您確實不需要對字符串進行太多操作，因此我認為不需要使用正則表達式。 另外，如果您檢查a標記中的href屬性而不是其文本名稱，則可能會更好，因為您可能希望href值為“ about.php”，而文本值為“ About Me”。

這是我會做的：

var pathy = location.pathname; //should return something like "/filename.php"
pathy = pathy.slice(1); //this will trim the first "/" character

$('#sidebar ul li a').each(function () {
    if ($(this).attr('href') == pathy) {
        $(this).addClass('active');
    }
});

這是一個小提琴樣品。

Answer 2

您在錯誤的上下文中使用了$（this）。 要實際選擇一個項目以使其受到影響，可以改用以下方法：

$('[pathname="' + pathy + '"]').addClass('active');

使用[name =“ value”]選擇器，您可以通過屬性來選擇一個選擇器。