Question

我得到了这个jQuery脚本，它应该添加这个类＆＃34; active＆＃34;我的李，但它没有。脚本如下：

jQuery(function() {
 var pgurl = jQuery(location).attr('href');
 console.log(pgurl);
 jQuery("ul.pagesubmenu-ul li a").each(function(){
      if(jQuery(this).attr("href") == pgurl)
      jQuery(this).parent().addClass("active");
 })

}）;

我真的不知道为什么它不起作用。我试图在this page上使用它（在主导航栏下方的子栏中）。

提前致谢！

Answer 1

而不是循环所有链接，您可以使用jquery通过其href属性直接选择它：

$(function() {
    $("a[href='" + location.href + "']").parent().addClass('active');
});

请注意，如果您在网站中使用相对网址，location.href将返回包含主机和方案的完整网址：

$(function() {
    $("a[href='" + location.pathname + "']").parent().addClass('active');
});

此外，您可以将一些字符用作通配符：

= is exactly equal
!= not equal
^= starts with
$= ends with
*= contains
~= contains word
|= starts with prefix

Answer 2

它没有在任何这些链接上获得完全匹配。 pgurl正在显示http://xn--fnpark-pua9l.dk/konference-ny/，但<a>代码不会显示尾随斜杠（http://xn--fnpark-pua9l.dk/konference-ny）。在比较字符串之前尝试清理网址。这是一个允许您这样做的线程：https://stackoverflow.com/a/2541083/5169684

Answer 3

为什么不工作？你能用你的导航结构做一个jsfiddle ......

HTML

<ul class="page"> <li><a href="1">Link</a> <ul class="subpage"> <li><a href="#">Sub Link</a></li> <li><a href="#">Sub Link</a></li> <li><a href="#">Sub Link</a></li> </ul> </li> <li><a href="2">Link</a></li> <li><a href="3">Link</a></li> <li><a href="4">Link</a></li> <li><a href="5">Link</a></li> </ul>

JQUERY

jQuery(function() { $("ul.page li ul.subpage li a").each(function(){ $(this).addClass('active'); }); });

https://jsfiddle.net/xp315ydq/

jQuery脚本不会添加活动类

3 个答案: