Javascript 在jQuery中，一次只能“切换”一个元素

如何在元素上切换类，但一次只能切换一个。 有一个解决方案是添加另一个for循环来禁用效果，但在pureJS中，我需要帮助才能在jQuery中完成这项工作

var elements=document.querySelectorAllbox； 对于var i=0；i.长度；i++函数i{ 元素[i]。onclick=函数{ 对于var j=0；j通常的方法是在将类应用于新选择的类之前，删除所有其他可能的“切换”上的类，如下所示：

var boxes = $('div.box');

boxes.click(function(){
  boxes.removeClass('red');
  $(this).addClass('red');  
});

当您有多个元素要应用它时，您应该使用类，而不是ID，所以我使用了.box，而不是box

---

另一个要点是只选择一次框，并将它们存储在click处理程序外部的变量中。这样，您就不会在每次单击时都重新选择它们。

该元素指的是当前单击的元素。 您需要将其应用于所有导航项目，如下面所示

变量 $box=$divbox.clickfunction{ $box.removeClassred； $this.addClassred； }; 正文{背景色：黑色；} 盒子{ 背景：白色； 颜色：红色； 文本对齐：居中； 框大小：边框框； 宽度：100px； 高度：100px； 显示：块； 浮动：左； 利润率：1%； } 红色盒子{ 背景：红色； }

---

如前所述，使用类而不是ID。您可以使用.not jQuery方法来实现这一点

注意：Beejamin的答案和我的答案之间的区别在于，在这个例子中，你可以切换红色类，再次单击同一个正方形，同时删除选择

var-box=$.box； box.clickfunction{ $this.toggleClassred； box.notthis.removeClassred； }; 身体{ 背景色：黑色； } .盒子{ 背景：白色； 颜色：红色； 文本对齐：居中； 框大小：边框框； 宽度：100px； 高度：100px； 显示：块； 浮动：左； 利润率：1%； } 瑞德先生{ 背景：红色； }

---

非常感谢，这正是我想要的解决方案。没问题。对于额外的点，请原谅我，如果这只是来自您的演示代码，您应该使用类似“selected”的类而不是red来应用selected状态。这样，当有人决定所选项目应该是蓝色时，您只需更改CSS！是的，我知道，这只是一个例子