失敗添加基於URL的活動導航類

Question

我使用下面的代碼在我的博客上有一個基本的菜單結構。我試過每個剪輯，也做了一些類似的話題，但沒有任何作用。 我想要做的就是將活動類添加到基於url的導航菜單中。因此，網站上的訪問者或用戶知道他在哪個網站或部分網站上。 那麼，有人可以請簡單地解釋在JavaScript中添加的位置和方法嗎？

菜單結構

<div id="navigation"> 
<div class="backer" style="position: relative;"> 
<div class="header-inner-wrap"> 
<div class="header section" id="header"> 
<div class="widget Header" data-version="1" id="Header1"> 
<h1><div id="header-inner"> 
<a href=""></a></div></h1> 
</div></div> 
</div> 
<nav class="main-nav" itemscope="itemscope" role="navigation"> 
<ul class="menu"> 
<li><a href="">About</a></li> 
<li><a href="">Tutorial</a></li> 
<li><a href="">Tips</a></li> 
</ul> 
</nav> 
</div> 
</div> 

的Javascript：

$(function() { 
    var pgurl = window.location.href.substr(window.location.href 
.lastIndexOf("/")+1); 
    $("menu li a").each(function(){ 
      if($(this).attr("href") == pgurl || $(this).attr("href") == '') 
      $(this).addClass("active"); 
    }) 
}); 

CSS：

.menu li .active{border-bottom:3px blue solid;} 

在此先感謝

Answer 1

您可能要檢查你的菜單類選擇是匹配一些事情：

$("menu li a").each(function(){ 

ahould是

$(".menu li a").each(function(){ 

編輯：基於新的信息，下面的變化應該解決您的問題。

從

var pgurl = window.location.href.substr(window.location.href.lastIndexOf("/")+1); 

更改爲

var pgurl = window.location.href; 

而且您的病情or一部分是不必要的。所以從這個

$("menu li a").each(function(){ 
     if($(this).attr("href") == pgurl || $(this).attr("href") == '') 
     $(this).addClass("active"); 
}) 

改變這種

$(".menu li a").each(function(){ 
     if($(this).attr("href") == pgurl){ 
      $(this).addClass("active"); 
     } 
}); 

從這個解決立即解決問題

除此之外，你應該努力學習JavaScript，而不是正常的複製和使用片段，讓您可以輕鬆地分析你的代碼，檢測問題的原因。