1

1つのページ内でdivを開いたり非表示にしたりするメニューに取り組んでいます。

私がやろうとしているのは、接続されているdivが開いている限り、現在クリックされているメニュー項目にクラス（.active）を適用することです。divが閉じられるか、他のメニュー項目が選択されるとすぐに、クラスは消える/他のメニュー項目に適用されます。

私は一緒に行こうとしまし$(".your_selector li").addClass("active");たが、あなたが期待するように、それはすべてのメニュー項目をアクティブとしてマークするだけです。

その問題にどのように取り組みますか？これがフィドルですhttp://jsfiddle.net/4DGUV/3/

前もって感謝します

4

3 に答える 3

4

このスクリプトに変更してください: http://jsfiddle.net/4DGUV/7/

$('document').ready(function () {
  $('button').click(function () {      //<----click the buttons
      $('button').removeClass('active'); //<-----remove the class from the button
      $(this).addClass('active'); //<---add the class to currently clicked button
      var $div = $('#' + $(this).data('href'));
      $('.demo').not($div).hide();
      $div.slideToggle();
   });
});

またはより良い方法: http://jsfiddle.net/4DGUV/8/

$('document').ready(function () {
  $('.menu li').click(function () {
    $(this).siblings().removeClass('active');
    $(this).addClass('active');
    var $div = $('#' + $(this).data('href'));
    $('.demo').not($div).hide();
    $div.slideToggle();
  });
});

次に、htmlは次のようになります。

<div class="menu">
  <ul>
    <li> <a href='#' id="show2" data-href="vission1">news</a>

    </li>
    <li> <a href='#' id="show3" data-href="mteam">team</a>

    </li>
    <li> <a href='#' id="show1" data-href="mission1">download</a>

    </li>
  </ul>
</div>
于 2013-02-12T10:31:55.000 に答える
0

liのクリックイベント内に追加する必要があります。

例

$(".your_selector li").click(function(){
    $(this).addClass('active');
});

あなたがしようとしているのはすべてのliタグに対するものであるため、クリックされたものを特定addClassするようにjqueryに指示する必要があります。addClassli

于 2013-02-12T10:24:50.603 に答える
0

次を使用します。

$(".your_selector li").click(function(){
    $(this).removeClass().addClass('active');
});
于 2013-02-12T10:26:45.247 に答える