Jquery ToggleClass不在两个类之间切换答案

【问题标题】：Jquery ToggleClass not toggling between two classesJquery ToggleClass不在两个类之间切换
【发布时间】：2017-02-07 22:38:44
【问题描述】：

我有这两个元素：

<div class="a"></div>
<div class="b"></div>

我还有一个复选框：

<input type="checkbox" id="checkbox" />

我正在尝试使用 jquery toggleClass 在两个类之间切换，如下所示：

$('#checkbox').click(function () {
        $(".urlWrapper .fileWrapper").toggleClass("urlWrapper fileWrapper");
    });

但它没有在两者之间切换....我做错了什么？

【问题讨论】：

您是要选择具有两个类的元素还是两个分离的元素？

标签： jquery

【解决方案1】：

您要达到什么目的，您似乎有两个类名不同的 div，而不是您想要达到的效果。以下是您要查找的内容吗？

$('#checkbox').on("click",function () {
        $(".a").toggleClass("urlWrapper fileWrapper");
        $(".b").toggleClass("urlWrapper fileWrapper");  
    });

.urlWrapper {
  color : red;
 }

.fileWrapper {
  font-weight:bold;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="a urlWrapper">
      content 1
    </div>
    <div class="b fileWrapper">
      content 2
</div>
    <input type="checkbox" id="checkbox" />

【讨论】：

【解决方案2】：

我认为这更符合您的要求。这些类是.a 和 .binstead of.urlWrapperand.fileWrapper`。此外，您需要有一个逗号来选择多个类。

$('#checkbox').click(function () {
  $(".urlWrapper, .fileWrapper").toggleClass("urlWrapper fileWrapper");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="urlWrapper">A</div>
<div class="fileWrapper">B</div>

<input type="checkbox" id="checkbox" />

【讨论】：