0

シンプルなナビゲーションがあります。クリックしたナビゲーション項目の周りに赤い枠を付けたいです。例: Store をクリックすると、Store という単語の周りに赤い境界線が表示されます。次に、別のナビゲーション アイテムである [連絡先] をクリックすると、赤い境界線がストアから出て連絡先アイテムに移動します。これが私がこれまでに持っているものです。

HTML:

<ul class="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">Store</a></li>
  <li><a href="#">Contact</a></li>
</ul>

CSS:

.active {
  border: 2px solid red;
  padding: 5px;
}

JS:

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

jQueryではそれほど強力ではありません。どんな助けでも素晴らしいでしょう...ありがとう！

4

3 に答える 3

3

あなたの JS はクラスを追加し、同じ要素から即座に削除します。これを試して

$('.nav li').click(function() {
   $('.nav li').removeClass('active');
   $(this).addClass('active');
}
于 2013-05-06T22:21:21.167 に答える
3

このコードは、あなたが探しているものでなければなりません:

$('.nav li').click(function() {
   $('.nav li.active').removeClass('active');
   $(this).addClass('active');
}
于 2013-05-06T22:21:29.690 に答える