当您在相应的页面上时,将.active类添加到导航
我目前正在使用脚本,该脚本将活动类添加到导航中的链接。这对大多数页面都正常工作,并将href与url进行比较。当您在相应的页面上时,将.active类添加到导航
我遇到的一个问题是当用户登陆域并且用户点击链接到主页时。链接到家:../
所以当你在主页上时没有什么可比较的脚本。
该脚本适用于所有其他链接,即../contact
和../blog/
,因为脚本可以将href与url进行比较。
我想过比较id形式的链接,但不能让它工作不幸。以下是我目前正在使用的脚本,可能需要进行编辑。
$(function(){
var url = window.location.pathname,
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$");
$('.nav-order a').each(function(){
if(urlRegExp.test(this.href.replace(/\/$/,''))){
$(this).addClass('current');
}
});
});
感谢您的帮助!
尝试,为什么你正在使用正则表达式这个
if (window.location.pathname == '/'){
/*you are on homepage*/
$('.nav-order a:first-child').addClass('current');
}
我是否使用这个脚本代替我自己的脚本,还是将它添加到我的当前脚本中? –
尝试在您的'each'语句之前添加 – joym8
嗨,对于迟到的回复抱歉,我尝试添加它,但不幸的是它不起作用。当用户登陆主页或简单登陆www.example.com时,导航栏中的每个项目都会添加活动类。 –
的原因吗? (这听起来像是如果你使用平等运营商,它会匹配如预期) –
当你知道它是首页,你可能不需要一个正则表达式。您可以简单地对该部分进行硬编码。 – joym8
我不得不承认,我从来没有这样做过。为了公平起见,我在网上发现了这个剧本,并认为它会适合我的需求。不幸的是我对jquery不太了解。 –