jQuery在点击主菜单的子菜单中添加活动类链接

时间:2013-02-22 17:24:48

标签: jquery

我正在尝试在项目时向子菜单(subnav)项添加活动类 在主导航中单击。目标是突出显示子菜单项 单击主菜单项。子菜单项是指向页面各部分的链接:

<div id="subnav">
  <ul>
    <li><a href="#adaptivetech">Adaptive Technology</a></li>
    <li><a href="#iepspecialed">IEP and Special Ed Forms</a></li>
    <li><a href="#behaviorplanning">Behavior Planning Forms</a></li>
    <li><a href="#npsnpainfo">NPS/NPA Information and Forms</a></li>
    <li><a href="#privateschoolref">Private School Referral for Assessment</a></li>
    <li><a href="#programtransfer">Program Transfer</a></li>
  </ul>
</div>

以下是主菜单的样子:

<ul class="sf-menu">
    <li><a href="newselpasite3.html">Home</a></li>
    <li><a href="#">Meetings/Workshops</a>
     <ul>
    <li><a href="#">Selpa Workshops</a></li>
      <li><a href="#">Selpa Committee Meeting for 2012-2013</a></li>
        <li><a href="#">Archived Agendas and Minutes</a></li>
              </ul></li>
    <li><a href="#" class="top_parent">Services</a>
    <ul>
    <li><a href="#">Adaptive Technology Center</a></li>
      <li><a href="#">Alternative Dispute Resolution</a></li>
        <li><a href="#">Autism Support</a></li>
          <li><a href="#">BEST Schoolwide Positive Behavior Support</a></li>
            <li><a href="#">Community Advisory Committee</a></li>
              <li><a href="#">Early Start Infant Program</a></li>
              </ul>
    </li>
    <li><a href="#" class="active">Forms</a>
    <ul>
      <li><a href="#adaptivetech">Adaptive Technology</a></li>
      <li><a href="#iepspecialed">All IEP and Special Education Forms</a></li>
       <li><a href="#behaviorplanning">Behavior Planning Forms</a></li>
       <li><a href="#npsnpainfo">NPS/NPA Information and Forms</a></li>
       <li><a href="#privateschoolref">Private School Referral for Assessment</a></li>
       <li><a href="#programtransfer">Program Transfer</a></li>
    </ul></li>

感谢。

2 个答案:

答案 0 :(得分:0)

可能是这样的:fiddle

$('ul li ul').find('li a').click(function(){
     var $this = $(this);
     $('a').removeClass('active');
     $this.addClass('active');
});

答案 1 :(得分:0)

尝试以下操作。

$('li').each(function(){
    if(window.location.href.indexOf($(this).find('a:first').attr('href'))>-1)
    {
    $(this).addClass('active').siblings().removeClass('active');
    }
});