jQuery - OnClick,在单击时始终更改表格单元格的背景颜色

Question

例如:你有一张桌子,它有4个tds和2个trs.表的背景颜色为白色.如果我点击A td,A td应为红色,如果我点击B,B td应为红色,A td也应为红色.如果我点击C比,C应为红色,B和A也应为红色.

我有类似的东西.但它并不好,因为当我再次点击时,我想将颜色改回白色.

http://jsfiddle.net/k8UgT/193/

我使用的代码

<table>
    <tr>
        <td onclick="function()">AAA</td>
        <td onclick="function()">BBB</td>
        <td onclick="function()">CCC</td>
    </tr>
        <tr>
        <td onclick="function()">DDD</td>
        <td onclick="function()">EEE</td>
        <td onclick="function()">FFF</td>
    </tr>
</table>

JS:

$( function() {
  $('td').click( function() {
    $(this).css('background', '#aaa')
  } );
} );

Answer 1

欢迎来到SO.

首先,你不需要onclick归因于td.其次,我建议使用CSS类而不是设置背景颜色.

CSS

.red-cell {
   background: #F00; /* Or some other color */
}

JS

$( function() {
  $('td').click( function() {
    $(this).toggleClass("red-cell");
  } );
} );

在这里阅读更多关于toggleClass的内容.更新了小提琴