单击时替换图像答案

【问题标题】：replace image when clicked单击时替换图像
【发布时间】：2013-02-17 19:06:19
【问题描述】：

我有两张表，第一张（id=symbols）包含 3 张图片。第二个表 (id=tbl) 将包含各种不同的图像。

我正在尝试用从符号表中选择的图像替换一个单元格的图像（在此示例中，假设它是顶行右侧的第二个单元格）。

我想在将鼠标悬停在符号表上时突出显示它们。单击时，我想用单击的图像替换另一个表格中的图像，并更改包含所选图像的表格单元格的背景颜色。我还需要能够识别单击了哪个图像（或单元格）。

这是我目前的小提琴不太好http://jsfiddle.net/bLb3H/70/。

感谢您的帮助。

<table id="symbols">
<tr>
<td  ><img src="http://icons.iconarchive.com/icons/deleket/soft-scraps/32/Button-Blank-Yellow-icon.png"/></td>
  <td  >
      <img src=" http://icons.iconarchive.com/icons/deleket/soft-scraps/32/Button-Blank-Blue-icon.png"/>

  </td>
  <td class="items  p1 p3"><img src="http://icons.iconarchive.com/icons/yootheme/social-bookmark/32/social-google-buzz-button-icon.png"/></td>      
  </tr>
</table>  

<table border="1" id="tbl">
<tr>
  <td ></td>
  <td  bgcolor=#000000 >
      <img src="http://icons.iconarchive.com/icons/deleket/soft-scraps/32/Button-Blank-Red-icon.png"/>
  </td>
  <td class="items  p1 p3"></td>      
  </tr>

  <tr>      
  <td bgcolor=#000000 ></td>
  <td class="items  p1"></td>
  <td class="items p3" bgcolor=#000000 ></td>
 </tr>

 <tr>      
  <td class="piece" id="p1" ></td>
  <td bgcolor=#000000 ></td>
    <td class="piece" id="p3" ></td>
  </tr>

</table>

jquery

  var imgs = $('img');

  imgs.click(function () {
    var img = $(this);
    $("#tbl").find("tbody tr").eq(2).children().first().attr('src', img);
  });

【问题讨论】：

标签： jquery html css

【解决方案1】：

这是一种方法。http://jsfiddle.net/4Ym43/

var imgs = $('img'); 

imgs.click(function(){
  var img = $(this); 
    $("#tbl").find("tbody tr:eq(0) td:eq(1) img").attr('src', img.attr('src'));
  //The cells we can move our image to.

});

虽然我更喜欢使用 id 或类

【讨论】：

非常感谢。有没有办法我也可以获得图像名称或 ID 或点击的图像？谢谢。