Jquery 单击时切换3个类（仅切换2个）

我的切换功能仅在3个类中的2个类中切换，而不是第3个类。它跳过了我的明星课，只是在我的事实课和巴尔课之间切换。我已经改变了很多方法，只在3个类中的2个类中切换

我的Html

<div id="labalt"><a href="#">Alt</a></div>
  <h1 id="build_title" class="barr" >Barracks</h1>

---

这是一种尝试。。。你不应该做什么

$("#labalt").click(function() {
$(this).toggleClass("fact star barr");

if($(this).hasClass("fact"))
{
    $("#build_title").html("Factory");
}
if($(this).hasClass("star"))
{
    $("#build_title").html("Starport");
}
if($(this).hasClass("barr"))
{
    $("#build_title").html("Barracks");
}
});

---

以下是工作示例：

我想，你的条件语句有问题

Case 1.  <div id="labalt" class="fact"></div>

  Result after toggling: <div id="labalt" class="star barr">

Case 2.  <div id="labalt" class="fact star"></div>

  Result after toggling: <div id="labalt" class="barr">

Case 3. <div id="labalt" class=""></div>

  Result after toggling: <div id="labalt" class="fact star barr">

一次可以有两个班

案例1:

---

第二个if条件设置为true，最后一个条件保持未选中状态。因此，如果存在“star”类，则不会执行最后一个条件，如果两个“star-barr”类都存在，这在逻辑上是错误的

您是否试图让代码在连续三次单击时循环浏览所有三个文本？因为这不是

toggleClass

所做的<代码>切换类打开或关闭一个或多个类

，单击链接可切换边框、字体大小和斜体类

它一开始没有一门课。单击1，它将拥有所有三个类。然后它将匹配第一个条件（它具有

事实

类），因为它们是

else if

，所以不会检查其他条件。文本将简单地设置为“工厂”

第二次单击时，所有三个类都将被删除。它将不符合第一个标准（

事实

）或第二个标准（

星型

），因此它将文本设置为“兵营”

第三次单击时，将再次添加所有三个类

---

如果你想让它在类中循环，你必须手动实现它；我不知道有什么现成的解决方案。您可能需要保留某种类型的游标，或者连续迭代数组以检查当前处于活动状态的类，然后继续下一个类；我相信它会更整洁。

似乎工作正常：对不起，我仍然遇到同样的问题。切换类功能工作正常。在切换classess后，您能给出初始html标记和最终html标记吗？我用我试图用该函数编辑的html元素编辑了我的原始帖子。此代码使其跳过事实类，只执行star和barr操作。>是的，我试着让它在所有3个标题之间循环，因为按钮被点击，我的barr类是默认的标题和类。我是jquery新手，所以我不知道其他方法，我已经用谷歌搜索出了这个问题。@RyanDay:好吧，看看我的答案，看看有什么解决办法。非常感谢你的帮助，它现在可以工作了。我仍然在阅读函数，试图完全理解每一行正在做什么。

Case 1.  <div id="labalt" class="fact"></div>

  Result after toggling: <div id="labalt" class="star barr">

Case 2.  <div id="labalt" class="fact star"></div>

  Result after toggling: <div id="labalt" class="barr">

Case 3. <div id="labalt" class=""></div>

  Result after toggling: <div id="labalt" class="fact star barr">

if($(this).hasClass("fact"))
{
$("#build_title").html("Factory");
}
else if($(this).hasClass("star"))
{
 $("#build_title").html("Starport");
}
else
{
  $("#build_title").html("Barracks");
}