Javascript 如何一次选择一个项目？

在默认状态下，我希望选择“全部”。单击另一项将更改所有其他类，以便“this”拥有该类，而其他则没有。我的问题是为什么不能重新选择“全部”

jsFiddle：

HTML:

Javascript:

$('a.orange').click(function(){
$('a.orange2').addClass('orange');
$('a.orange').removeClass('orange2');
$(this).removeClass('orange');
$(this).addClass('orange2');
});

---

在Javascript代码中，您仅将onClick侦听器应用于

a.orange

（

a

类为

orange

的元素）

由于“ALL”菜单项的类不是

orange

，而是

orange2

，因此它不受此影响

您可以通过在选择器中包含

a.orange2

来解决此问题：

$('a.orange, a.orange2').click(function(){ ... });

---

也许是这样的：

 <ul class="nav2">
      <li><a href="#" class="orange2">ALL</a></li>
      <li><a href="#" class="orange2">PERSONAL</a></li>
      <li><a href="#" class="orange2">PHOTOGRAPHY</a></li>
      <li><a href="#" class="orange2">WORK</a></li>
 </ul>

 $('a.orange2').click(function(){
      $('a.orange2').removeClass('orange2').addClass('orange');
      $(this).addClass('orange2').removeClass('orange');
 });

$（'a.orange2'）。单击（函数（）{
$（'a.orange2'）.removeClass（'orange2'）.addClass（'orange2'）；
$（this.addClass（'orange2'）。removeClass（'orange'）；
});

$('a.orange').click(function(){ ... });

$('a.orange, a.orange2').click(function(){ ... });

 <ul class="nav2">
      <li><a href="#" class="orange2">ALL</a></li>
      <li><a href="#" class="orange2">PERSONAL</a></li>
      <li><a href="#" class="orange2">PHOTOGRAPHY</a></li>
      <li><a href="#" class="orange2">WORK</a></li>
 </ul>

 $('a.orange2').click(function(){
      $('a.orange2').removeClass('orange2').addClass('orange');
      $(this).addClass('orange2').removeClass('orange');
 });