0

参考：jsFiddle

上記の jsFiddle には、親要素と呼ぶliクラス名を持つ要素があります。jQuery を使用してそれを選択すると、のカスタムが適用されます。accordionbackground-colorgreen

ただし、特定のアンカーの最初の選択中にjQueryがクラス名を適用するときに、子要素li、正確にはアンカー要素も必要です。tealactive

HTML:

<ul class="tabs">

   <li class="accordion"><a href="#tab1">Boo1</a>

      <ul id="sub-nav">
         <li><a href="#"> Ipsum Text</a></li>
         <li><a> Lorem text</a></li>
         <li><a> More lorem text </a></li>
         <li><a> Dolor Sit Amet </a></li>
      </ul>                                   

  </li>

  <li><a href="#tab2">Boo2</a></li>
  <li><a href="#tab3">Boo3</a></li>
  <li class="last-item"><a href="#tab4">Boo4</a></li>

</ul>

CSS:

.tabs li.active { background: green; }
.tabs li {font-size:20px;}
#sub-nav li {font-size:16px; margin-left:20px;}
#sub-nav li a.active {background:teal;}

jQuery:

(function(){

    $('.tabs li').on('click', function(e){
        $('.tabs li').removeClass('active');
        $(this).addClass('active');
        $(this).closest('ul').closest('li').children('a').addClass('active');
    })       

}());
4

1 に答える 1

2

これはあなたが望むものですか？$("ul li a", $(this))「サブのアンカータグ」です。

于 2012-07-25T06:58:34.260 に答える