javascript - jQuery - 在 $(this) 上切换类并删除所有其他类

Question

这是我正在使用的 jQuery 片段:

$('.panel-title').click(function(){
  $(this).find('.state').toggleClass('rotate');
});

更新 - 编辑 fiddle 以匹配更多我正在处理的内容

这是一个 fiddle ，向您展示我在说什么
https://jsfiddle.net/ke1hwn7f/9/

我需要做的是来回切换类。这很简单。但我还需要对其进行设置，以便如果该类已存在于我需要删除的元素上。

因此在 fiddle 中您可以看到，当您单击“这是标题 4”时，它会切换“colorChange”类。但是然后您单击“这是标题 2”，我需要它来切换那个绿色，但也希望在它切换刚刚单击的元素之前从“这是标题 4”(或它可能存在的任何其他地方)中删除类。

我有办法做到这一点吗？

Answer 1

你去吧:

$('.panel-title').click(function(){
  // If the clicked element has the rotate class, remove the rotate class from EVERY .panel-title>.state element
  if ($(this).find('.state').hasClass('rotate')){
    $('.panel-title').find('.state').removeClass('rotate');
  }
  // Else, the element doesn't have the rotate class, so we remove it from every element before applying it to the element that was clicked
  else {
    $('.panel-title').find('.state').removeClass('rotate');
    $(this).find('.state').addClass('rotate');
  }
});

如果它有类，则将其删除到每个标题，否则，将其删除到所有但将其添加到您点击后的那个。