1

次の JavaScript を編集するのに助けが必要です。

<script>
  $('.nav li a').on('click', function() {
    $(this).parent().parent().find('.active').removeClass('active');
    $(this).parent().addClass('active');
  });
</script>

================================================== =================

既存の機能に加えて、「link1」がクリックされたときに「link2」が「アクティブ」になる必要があります。以下の HTML を参照してください。

<h1 class="brand"><a href="#link1">Brand</a></h1>
<ul class="nav">
  <li class="active"><a href="link2">One</a></li>
  <li><a href="link3">Two</a></li>
  <li><a href="link4">Three</a></li>
</ul>
4

2 に答える 2

0

ページにアクティブな要素が 1 つだけあると仮定すると、次のようなことができます。

  $('.nav li a').on('click', function() {
    $('.active').removeClass('active');
    $(this).parent().addClass('active');
  });

そうでない場合は、closestそのように使用できます

  $('.nav li a').on('click', function() {
    $(this).closest('.active').removeClass('active');
    $(this).parent().addClass('active');
  });

あなたのコメントから、これはうまくいくと思います

  $('.nav li a').on('click', function() {
    $('active').removeClass('active');
    var link = $(this).attr('href'), // link1
        number = parseInt(link.substr(-1)), // 1
        newHref = link.slice(0, link.length - 1) + number++;
    $(newHref).addClass('active');

  });

をクリックすると、アクティブなクラスが取得され、 をクリックするlink1と取得されます....link2link2link3

于 2013-08-11T02:43:47.580 に答える
0

以下のコードを使用できます。jsFiddle のサンプルはこちらから入手できます

  $('.nav li a').on('click', function (event) {
      event.preventDefault(); //Add this only if you want to stop the default link action.
      $(this).parent().siblings('li').removeClass('active');
      $(this).parent().addClass('active');
  });

  //The below is to make #link2 active whenever #link1 is clicked.
  $('.brand a').on('click', function () {
      $('.nav li:first').addClass('active');
      $('.nav li:first').siblings('li').removeClass('active');
  });
于 2013-08-11T03:01:27.403 に答える