Question

我有一个菜单代码，比较菜单项和URL的href，如果比较为真，则激活类。

代码

$(".gallery-navigation-container ul li a").each(function() {
    if ($(this).attr("href") == location.href) {
        $(this).addClass("active");
        $(this).parent().addClass("active-el");
    }
});

在另一个网站上我遇到了问题，菜单项中的链接并不像http //一样绝对，依此类推，它就像/about/，而且比较为假。

问题：如何比较它以将活动类转换为活动元素？

更新

尝试使用

jQuery(document).ready(function($){
        var url = window.location.href;
        $('.navigation a').filter(function() {
             return this.href == url;
        }).addClass('better-active');
    });

没有错误但没有结果......没有添加课程。当它是当前页面时，它会删除链接中的href ...哈哈

更新2

jQuery(document).ready(function($){
        var url = window.location.href;
        $('.navigation ul li a').each(function() {
         return $(this).attr("href") == url;
       }).addClass('better-active');
    });

它有效，但删除当前项目href并获取每个项目类......是否有任何方法可以修复它？过滤功能不提供任何内容

Answer 1

您可以尝试使用location.pathname代替href

 var path = window.location.pathname;
 path = path.replace(/\/$/, "");
 path = decodeURIComponent(path);

 $(".gallery-navigation-container ul li a").each(function() {
    if ($(this).attr("href") === path.substring(0, $(this).attr("href").length)) {
        $(this).addClass("active");
        $(this).parent().addClass("active-el");
    }
 });

检查此example以获取类似的实施细节

菜单不是绝对href与位置href问题比较

1 个答案: