Question

我正在使用jquery熔岩灯菜单。我想在li标签上添加当前类而不是标签这是我的菜单

<div>
 <ul class="lavaLamp">
   <li><a href="index.php">Home</a></li>
   <li><a href="about.php">About</a></li>
   <li><a href="contact.php?page=contact">Contact</a></li>      
  </ul>
</div>

我试过这个。

$(function(){ 
  var url = window.location.pathname,  
  urlRegExp = new RegExp(url.replace(/\/$/,'') + "$");         
  $('.lavaLamp li a').each(function(){  
  if(urlRegExp.test(this.href.replace(/\/$/,''))){ 
    $(this).addClass('current'); 
    } 
  });
});

我已经尝试过在网络上发现的所有内容，但对我来说没有任何作用。我不知道为什么所有代码都不起作用。我有额外的子文件夹我的网址如下：
http://example.com/mysite/index.php
http://example.com/mysite/about.php

Answer 1

你的正则表达式似乎不起作用。无论如何，这是一个解决方案：

$(function(){
 var url = window.location.pathname;  
    var activePage = url.substring(url.lastIndexOf('/')+1);
 $('.lavaLamp li a').each(function(){  
    var currentPage = this.href.substring(this.href.lastIndexOf('/')+1);

    if (activePage == currentPage) {
    $(this).parent().addClass('current'); 
 } 
});
})

请注意，我使用 .parent（）来获取 li 元素，因为您写道要添加.current到 li ，而不是一

Answer 2

$('.lavaLamp li:has(a[href="'+location.href.split("/").reverse()[0]+'"])').addClass('current');

那会有用吗？

Answer 3

这里的问题是你的子文件夹。在http://example.com/mysite/index.php window.location.pathname的情况下，应该返回/mysite/index.php。然后你说锚点href（例如index.php）必须匹配它，它显然不匹配。您想要更健壮地检查它是否是同一页面。我建议实际上让服务器确定这个，因为它运行时它会清楚地知道它在哪个页面上。如果网站只有一个文件夹中的页面，但是如果你在子文件夹中有页面，那么你可以简单地按照别人的建议方式去做，那么它可能会变得更加混乱......

另外要在li上设置课程，然后一旦你有了a，那么你只需要做类似的事情：

$(this).parent().addClass('current');

如何在当前页面菜单上添加当前类

3 个答案: