jquery：改变 class（但不是）改变动作

Question

我发现了一个奇怪的行为.. 肯定知道，但我不知道如何解决它。

我有一个按钮必须根据当前 class 执行 2 个不同的操作。

单击时，它会切换其 class，这样，下次单击时将执行不同的操作。但它继续执行 "old" 操作，就像 class 没有被更改

更清楚...

here the relative Fiddle

您可以看到，当您单击按钮 A 时，它会显示 AAA 并且两个按钮会切换它们的 class （因为颜色已更改）：因此看起来一切正常

但是，如果您再次单击按钮 A 而不是按下 class b 按钮时应该发生的 BBB，它会再次写入 AAA

显然可以有 2 个按钮用于 2 个操作并切换 2 个按钮而不是交换 class，但我想了解我是否做错了什么或这种奇怪行为的原因。

此致

Answer 1

在添加和删除用于绑定事件的类时，您需要使用事件委托：

$('body').on('click','.a',function(){
    $('#R').html('AAA');
    $('#A').addClass('b').removeClass('a');
    $('#B').addClass('a').removeClass('b');
});
$('body').on('click','.b',function(){
    $('#R').html('BBB');
    $('#B').addClass('b').removeClass('a');
    $('#A').addClass('a').removeClass('b');
});

Working Demo

jquery：改变 class（但不是）改变动作

jquery: changing class (but not) changing action

jquery

class

buttonclick