當您在相應的頁面上時，將.active類添加到導航

我目前正在使用腳本，該腳本將活動類添加到導航中的鏈接。這對大多數頁面都正常工作，並將href與url進行比較。當您在相應的頁面上時，將.active類添加到導航

我遇到的一個問題是當用戶登陸域並且用戶點擊鏈接到主頁時。鏈接到家：../所以當你在主頁上時沒有什麼可比較的腳本。

該腳本適用於所有其他鏈接，即../contact和../blog/，因爲腳本可以將href與url進行比較。

我想過比較id形式的鏈接，但不能讓它工作不幸。以下是我目前正在使用的腳本，可能需要進行編輯。

$(function(){ 

var url = window.location.pathname, 
    urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); 

    $('.nav-order a').each(function(){ 

     if(urlRegExp.test(this.href.replace(/\/$/,''))){ 
      $(this).addClass('current'); 
     } 
    }); 
});

感謝您的幫助！

來源

2017-10-12 Quincy Norbert

的原因嗎？（這聽起來像是如果你使用平等運營商，它會匹配如預期） –

當你知道它是首頁，你可能不需要一個正則表達式。您可以簡單地對該部分進行硬編碼。 – joym8

我不得不承認，我從來沒有這樣做過。爲了公平起見，我在網上發現了這個劇本，並認爲它會適合我的需求。不幸的是我對jquery不太瞭解。 –

嘗試，爲什麼你正在使用正則表達式這個

if (window.location.pathname == '/'){ 
    /*you are on homepage*/ 
    $('.nav-order a:first-child').addClass('current'); 
}

來源

2017-10-12 01:33:30 joym8

我是否使用這個腳本代替我自己的腳本，還是將它添加到我的當前腳本中？ –

嘗試在您的'each'語句之前添加 – joym8

嗨，對於遲到的回覆抱歉，我嘗試添加它，但不幸的是它不起作用。當用戶登陸主頁或簡單登陸www.example.com時，導航欄中的每個項目都會添加活動類。 –

當您在相應的頁面上時，將.active類添加到導航

回答

相關問題