javascript - 通过单击按钮 jquery 设置和重置文本

Question

我的页面上有一些按钮，即按钮“一”、按钮“二”等。还有一个包含“设置此”的文本。

要求:

1. 当用户点击按钮“One”时，

   (a) 按钮应该变成深色背景色(选中/事件状态)

   (b) 文本，“Set this”应该根据点击按钮的文本更改为文本。在这种情况下，“设置此”将更改为“设置一个”

2. 当用户再次点击“One”按钮时，

   (a) 按钮应该返回到它之前的状态(浅色背景版本)

   (b) 更改的文本(“Set One”)应重置并返回到默认状态(“Set This”)

其他按钮的要求相同。我可以满足要求 1 和 2(a) 但我不能满足 2(b)。我怎样才能做到？

我的 fiddle 作品:http://jsfiddle.net/learner73/VFPLf/

$('.btn').click(function(){
    $(this).toggleClass("active");

    $('.changeText').text($(this).data("text"));
});

Answer 1

如果我对问题的理解正确，这可能是你最好的选择

$('.btn').click(function(){
    $(this).toggleClass("active");    
    if ($('.changeText').text() == $(this).data("text")) {
       $('.changeText').text("This");
    } else{
       $('.changeText').text($(this).data("text"))
    }
});

JSFiddle