javascript - 从其他元素上的点击事件访问图像 src 属性

Question

我有一个 div 被点击(删除按钮)，它位于我页面上的 img 之后。

     <div class="item">
           <img src="/media/BodyPart_e4fc6673-1476-42d2-a98d-947b0e79fd99/300/0" class="media-item">
           <div class="remove" title="Remove"></div> //getting clicked
    </div>

所以在点击事件上我通过这段代码访问 img:

var img = $(this).prev("img.media-item");

然后我想访问 img 的 src 属性

var extracted_string = img.src.match(/BodyPart[^\/]*/);

但 img.src 不足

我该如何解决？

UPDATE

我只是发现如果我这样做 $(this).prev("img.media-item").attr("src") - 我可以得到 源代码

但是为什么 var img = $(this).prev("img.media-item"); $(img).attr("src") 不工作

Answer 1

在 jQuery 中通过单击 .remove div 获取 img 的一种干净的方法是这样的:

$(".remove").click(function(e) {
     var src = $(this).closest(".item").find(".media-item").attr("src");
});

这样做的好处是，即使布局有所改变，它也会找到所需的图像，因此它不依赖于元素的精确相对定位(使其比依赖于一个元素的技术更健壮)就在另一个之前)。

这是 jQuery 代码中的一种非常常用的技术，用于查找与您所在的树的同一分支中的另一个元素，并且当存在具有相同结构的重复项组时效果很好。单击任何 .remove 项都可以对同一分支中的任何其他项进行操作。