javascript - jQuery:加1后仅减去1

我该如何在jQuery中做到这一点。我已经有一个脚本，单击按钮后可以加1。但是，我还需要一些东西，如果我再次单击该按钮，然后将其恢复为原始状态，则应该减去1。

这是我当前的jQuery代码

$(document).ready(function() {
    $("#addMe").one('click',function(){
        var counter = parseInt($("#hiddenVal").val());

        counter++;

        $("#hiddenVal").val(counter);
        $("#theCount").text(counter);
        $("#addMe").toggleClass('active');
    });
});

这是我的现场js小提琴:http://jsfiddle.net/jehzlau/7hv2eyv0/

现在，单击后它会加1。该按钮仅可单击一次以添加+1。按钮的颜色将改变。那是我试图实现的第一个，并且已经在起作用。

我现在唯一的问题是再次单击后还原更改。

例如，如果您单击该按钮，它现在是蓝色，心脏是黑色，数字是2。我要的是，如果再次单击它，则该按钮默认情况下将再次变为绿色，心脏变为白色，并且数字2到1。我只想反转第二次单击时发生的情况。然后，如果我再次单击(第三次单击)，它将返回到2，则按钮将变为蓝色，并且心脏将再次变为黑色。如果我再次单击它(第四次单击)，它将再次还原。等等等等...

这就是我要做的，但是我做不到。我希望这里有人可以指出正确的方向。 :(

最佳答案

我会这样。查看 Activity 类是否存在，然后基于该类进行递增/递减计数器:

       $("#addMe").on('click',function(){
            var counter = parseInt($("#hiddenVal").val());
            if($(this).hasClass('active'))
                counter--;
            else
                counter++;
            $("#hiddenVal").val(counter);
            $("#theCount").text(counter);
            $("#addMe").toggleClass('active');
        });

Working Demo

关于javascript - jQuery:加1后仅减去1，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25237486/