当相关页面打开时,我想在项目菜单上添加“活动”类。
菜单很简单:
<ul id="main-menu">
<li class="blue">
<a href="http://localhost/maxinventions/">Home</a>
</li>
<li class="orange">
<a href="http://localhost/maxinventions/client">Clients</a>
</li>
<li class="puprle">
<a class="active" href="http://localhost/maxinventions/work">Work</a>
</li>
<li class="yellow">
<a href="http://localhost/maxinventions/about">About Us</a>
</li>
<li class="green">
<a href="http://localhost/maxinventions/contact">Contact Us</a>
</li>
</ul>
我已经能够将活动类添加到菜单中,但问题是当我访问更深的 url 时脚本无法工作。例如,如果我访问http://my-site.com/work/web-architecture-and-development,活动类就消失了。
这是我的脚本
$(function(){
var url = window.location.pathname,
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$");
$('#main-menu a').each(function(){
// and test its normalized href against the url pathname regexp
if(urlRegExp.test(this.href.replace(/\/$/,''))){
$(this).addClass('active');
}
});
});
任何解决方案?