如何在jquery中获取最接近的img标签？

Question

HTML

<tr class='test_file'>
    <td id=img_id><img src='"+ROOT_PATH+"/assets/arrow_black_right.png' /></td>
    <td colspan=2 id=fileName>"+fileName+"</td>
</tr><span>

我需要在jQuery中点击 id = fileName 的td时更改图像。

如何使用jQuery获取img标记并更改其src属性？

我正在尝试做这样的事情：

$($(this).closest("img")).attr("src")

Answer 1

使用.closest和.find()

的组合

closest找到祖先

你需要找到它的后代和而不是祖先

所以你需要首先找到最接近的行，其中包含filename id元素，然后find img，它是相应行的后代

$(this).closest('tr').find("img").attr("src"); // using find

或

var $tr = $(this).closest('tr'); // get the closest row
$("img", $tr).attr("src");  // use a context to get the image

Answer 2

您可以使用.siblings()

的JavaScript / jQuery的

$(this).siblings("#img_id").children('img').prop('src');

修改

JSFiddle proof

Answer 3

“单击id = fileName的td”：您将不得不前往tr元素，然后使用find搜索后代以查找图像元素。 .parentNode会找到this的父元素（在这种情况下为<td>）。 find("img")会找到第一个td元素中包含的图片标记。

$($(this.parentNode).find("img")).attr("src")

Answer 4

您需要稍微清理代码，因为您有一个随机<span>并且第一个<td>未关闭。你的身份证需要用双引号括起来。

http://jsfiddle.net/pjdicke/tQ5vr/5/

<table>
   <tr class="test_file">
      <td id="img_id"><img src="http://www.abmuku.com/wp-content/uploads/2012/04/google-logo-small.jpg" /></td>
      <td colspan=2 id="fileName"><button>file name</button></td>
   </tr>
</table>

$('button').on('click', function(){
    $(this).closest('tr').find('td img').attr('src','http://atoralhistory.uconn.edu/images/Yahoo_logo_small.gif');
});

Answer 5

试试这个

$(this).siblings().find('img').prop('src','your_image_url');

DEMO

Answer 6

您必须替换new_src变量。

$(function() {
   $('#fileName').on('click', function() {
      $(this).closest('tr').find('img').attr('src', new_src);
   });
});