单击时更改按钮的值

Question

我试图在单击时更改按钮的颜色。 我不知道这段代码有什么问题。

paginationContainer.find("li").on('click', function() {

    var linkNumber = $(this).text();

    $(linkNumber).removeClass('active').addClass('inactive');
    $(this).removeClass('inactive').addClass('active');

});

.active {
    background: yellow
}

.inactive {
    background: red
}

Answer 1

您需要将类应用于 li - 而不是文本，您也可以使用 .toggleClasss() 来交换活动和非活动的类。

paginationContainer.find("li").on('click', function(){
   $(this).toggleClass('active inactive');
});

Answer 2

你在找这样的东西吗

HTML

<button class="clickMe">
Button1
</button>
<button class="clickMe">
Button2
</button>
<button class="clickMe">
Button3
</button>
<button class="clickMe">
Button4
</button>

CSS

.clickMe{

  padding:3%;
  background-color:cyan;
  color:white;
}

JS

$('.clickMe').click(function(){
$(this).css('background-color',"green");
});

工作小提琴