如何用jQuery选择CLICKED项？

Question

我正在使用此代码删除和CSS类：

$('.called').click(function() {
    $('called').removeClass('fa-phone-square').addClass('fa-check');
})

问题是，它删除了类并使用类'.called'将类添加到所有标记。我希望此功能仅适用于已单击的单个项目。

我该怎么做？

Answer 1

你必须这样做：

$('.called').click(function() {
    $(this).removeClass('fa-phone-square').addClass('fa-check');
})

点击处理程序中的“this”指的是已单击的元素以及要应用更改的元素。

如果您再次应用“.called”选择器，它将选择具有“被调用”类的所有项目，并将removeClass和addClass应用于所有这些，这是您现在遇到的行为。

Answer 2

在jQuery事件处理程序this中绑定了触发事件的DOM节点。

$('.called').click(function() {
    $(this).removeClass('fa-phone-square').addClass('fa-check');
})

Answer 3

在回调中，$(this)指的是被点击的元素。

您还可以将事件作为回调中的参数，并使用event.target - https://api.jquery.com/event.target/

获取点击的元素

使用$(this)和event.target - Difference between $(this) and event.target?

之间的区别