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 () {

如何使用jQuery更改img

2 个答案: