jquery - 如何使用 jQuery 更改点击时的 img

Question

我有这段代码可以在表格中显示小图像

<table>
<tr>
<td class='change' id='c1'><img src='images/on.gif'/></td>
<td class='change' id='c2'><img src='images/on.gif'/></td>
<td class='change' id='c3'><img src='images/on.gif'/></td>
<td class='change' id='c4'><img src='images/on.gif'/></td>
<td></td>    
</tr>
</table>  

如何在点击事件时更改表格中任何一张图像的图像。我试过这样做，但似乎无法让它工作。

$(document).on('click', '.change', function() {
if (this.src == 'images/on.gif')
  this.src = 'images/off.gif';
else
  this.src = 'images/on.gif';
});

我已经搜索过了，是的，我发现了类似的问题，但我似乎真的无法让它发挥作用。

Answer 1

.change不是图像，它是父 TD ：

$(function() {
    $(document).on('click', '.change', function () {
        var img = $(this).find('img');
        img.attr('src', (img.attr('src') == 'images/on.gif' ? 'images/off.gif' : 'images/on.gif'));
    });
});

Answer 2

.change是表格单元格元素，而不是图像元素

$(document).on('click', '.change img', function () {