Javascript Jquery-单击复选框后更改表格单元格颜色

我正在创建一个交叉矩阵，我将在其中交叉条目；就像男人和女人一样。我使用一个动态生成的表来实现这一点，其中每个单元格都属于雌性的杂交

看起来像这样：

Female/Male | Male1 | Male2 |
------------------------------
Female1     |   x   |   x   |
------------------------------
Female2     |   x   |   x   |
-----------------------------

上面是一个表格，每个单元格都包含一个复选框，用于标识十字

下面是我使用php生成表的代码：

<table>
<?php
    foreach($females...){
       echo "<tr>";
       ...so on
       //set up the rows and headers
       foreach($males...){
              echo "<td ...><input type='checkbox'../></td>
              ..and so on
       }    
    }

?>
</table>

这假设您希望选中时显示绿色，不选中时显示红色。你没有确切地告诉我们

查找复选框的父项。我对parents（）这样做是因为如果稍后将元素添加到堆栈中，您的代码就会出错，您不知道为什么

<td ...><input type='checkbox' 
         onclick="$(this).parents('td').css('background-color', $(this).is(':checked') ? 'green' : 'red');" />
</td>



在必要的地方添加转义引号，使其与php的echo命令一起工作。
到底是什么……等等等等？别指望我们猜到你的密码。在JSFIDLE中复制它。