Question

我在桌子里面有按钮，点击里面的表格按钮想要改变那个按钮的背景颜色和同一颜色的其他按钮

我尝试使用如下的jquery

$('#bt1').click(function() {
    $('#bt1').css('background', 'red');
});

但它仅适用于一个按钮

<table id="abcd">
    <tr>
        <td><button class="cellGreen" id="bt1"><font>HOME</font></button></td>
        <td><button class="cellGreen" id="bt2"><font>PROJECT</font></button></td>
        <td><button class="cellGreen" id="bt3"><font>TEST</font></button></td>
        <td><button class="cellGreen" id="bt4"><font>Help</font></button></td>
    </tr>           
</table>

<button id="btdffd1"><font>Other Buttons</font></button>
<button id="btdffd1"><font> Buttons</font></button>

Answer 1

你必须使用它的班级cellGreen

$('.cellGreen').click(function() {
  $('.cellGreen').css('background', '');
  $(this).css('background', 'red');
});

Answer 2

你可能需要这个：

将您的选择器更改为班级.cellGreen并应用以下脚本，该脚本会将其他按钮的背景设置为默认值，并将红色设置为所点击的。

$('.cellGreen').click(function () {
     $(".cellGreen").css("background","");
     $(this).css('background', 'red');
});

Demo

Answer 3

<强> Demo

对于所有按钮，使用$('td button')作为选择器

$('#bt1').click(function() {
    $('button.cellGreen').css('background', 'red');
});

要点击所有按钮，请使用：

$('button.cellGreen').click(function() {
    $('button.cellGreen').css("background","");
    $(this).css('background', 'red');
});

注意：您的最后两个按钮有重复的ID。

jquery背景颜色更改按钮单击内表

3 个答案:

Demo