失败添加基于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，而不是正常的复制和使用片段，让您可以轻松地分析你的代码，检测问题的原因。