Javascript 覆盖覆盖覆盖覆盖图像-可以'；t自动化src

我有一个使用jquery的图像，当单击图像时，它将返回该图像的图像src。我修改了我的HTML/CSS以给这个图像一个覆盖

但是，我现在添加了一个覆盖，当图像悬停时，覆盖从左到右。这增加了复杂性，现在当jquery试图找到图像src时，它无法找到，因为覆盖层正在覆盖它

这意味着我必须手动为每个图像src编写代码，但这不起作用，因为显然，当您单击每个图像时，每个图像都将具有不同的img src

举个例子：

$(".dogs img").click(function(){
        var src = $(this).attr("src");
    });

现在我有了一个覆盖图，除非我真的很快，并击败覆盖我屏幕的覆盖图，否则我不能点击图像，只能点击覆盖它的覆盖图

<div class = "cover-overlay">
     <img src = "dog-1.png">
</div>

<div class = "cover-overlay">
     <img src = "dog-2.png">
</div>

<div class = "cover-overlay">
     <img src = "dog-3.png">
</div>

---

然而，这显然总是会返回dog类中第一个图像的源，因为click函数现在是如何与overlay一起工作的。有什么建议吗？

您仍然可以使用

此

引用已单击的

。覆盖覆盖覆盖

元素，但现在还需要使用

find（）

从中获取子

img

：

$(".dogs .cover-overlay").click(function(){
  var src = $(this).find('img').prop("src");
});

在此处添加$（this）：var src=$（“.dogs img”，$（this））.attr（“src”）；

$(".dogs .cover-overlay").click(function(){
  var src = $(this).find('img').prop("src");
});