導航鏈接單擊jQuery時切換活動類

Question

我正在嘗試將jQuery添加到網站，以便在單擊導航菜單中下一頁的鏈接時，將“活動”類切換到“活動”或當前頁面。 最初還將“活動”類設置為主頁。 另外，這是一個使用Bootstrap的網站，所以我想知道是否與jQuery發生沖突。 看起來很簡單，我的代碼也能正常工作。 它將活動主頁從主頁上刪除，並在下一個選項卡上短暫閃爍，但它不會保持“活動”狀態。 這是jQuery：

$(".nav li").click(function() {
    $('li').removeClass('active');
    $(this).addClass("active");

});

對我可能做錯的事情有任何想法嗎？ 提前致謝。

安德魯

Answer 1

我遇到了類似的問題，並編寫了以下腳本：

var _urlpath = $(location).attr('pathname').split('/').pop();

    $('#menu > li').each(function(){
        var _this = $(this);
        var _str = _this.find('a').attr('href');
        _str !== _urlpath ? _this.removeClass('active') : _this.addClass('active');
    });

這很簡單：過濾url路徑名稱，將其存儲在變量中，然后最重要的是，在加載新頁面時，遍歷所有li並嘗試匹配url哈希（我不知道確切的術語） ，在li> a的哈希。

las，也許有更好的方法可以做到這一點。