Jquery 在图标上切换类，而不会影响具有相同类的其他图标

Jquery toggleClass on icon without affecting the other icons with the same class

本文关键字：图标 影响 同类 其他 Jquery      更新时间：2023-09-26

我有几个与 bg-img 相同的 svg divs（基本上是音频播放器按钮），我想切换每个点击元素的类而不影响其他元素。我真的不知道如何正确选择我正在单击的单个 ememlemnt，而不是同时选择所有 emelemn。

html 是：

<ol class="tracks">
  <li>some text
    <div class="play"></div>
  </li>
  <li>some text 
    <div class="play"></div>
  </li>
  ...
</ol>

我在每个div中放置了与bg-img相同的svg。

当然，我无法切换.play，因为我只会同时更改所有divs，所以我尝试$this：

$('.play').click(function() {
  $this.toggleClass('clicked');
});

在clicked类中，我只需将 bg-img 更改为 bg-img（例如，从播放.svg更改为暂停.svg反之亦然）。显然，我的Jquery有问题，但是，作为一个菜鸟，我无法弄清楚它会是什么。

如果您能帮助我，我将不胜感激。 ^_^

你的方法是正确的。它会起作用。将您的 js 更新为：

$('.play').click(function() {
  $(this).toggleClass('clicked');
});

请参阅此处更改类的示例：https://jsfiddle.net/ddan/zLx03L1u/1/

相关文章：