Javascript jQuery onclick未获取正确的值

我试图在单击事件时获取图像ALT值，但它没有正常工作，并在单击时显示相同的值（图像ALT）

代码如下：

HTML:

<a href="//cdn.shopify.com/s/files/1/0720/9527/products/MDM02-south-east-postcode-district-map-detail-large_ee8e2826-b33b-4c77-83b2-f162df33ec33_large.gif?v=1420644155" class="product-photo-thumb" title="Map 1">
    <img id="imgVariants" src="//cdn.shopify.com/s/files/1/0720/9527/products/MDM02-south-east-postcode-district-map-detail-large_ee8e2826-b33b-4c77-83b2-f162df33ec33_compact.gif?v=1420644155" alt="Map 1">
</a>

<a href="//cdn.shopify.com/s/files/1/0720/9527/products/png_large.png?v=1420644163" class="product-photo-thumb" title="Map 2">
    <img id="imgVariants" src="//cdn.shopify.com/s/files/1/0720/9527/products/png_compact.png?v=1420644163" alt="Map 2">
</a>

我遗漏了什么吗

---

---

p.S.：我知道Id必须是唯一的，但我想要一个即使没有唯一Id也能工作的解决方案。

有两个元素具有相同的Id（不应该是），请删除它们，您应该使用类似

e.target

这是一个有效的例子

---

有两个元素具有相同的Id（不应该是），请删除它们，并应使用类似于

e.target的内容

这是一个有效的例子

试试这个代码

$(document).ready(function(){
    $('.product-photo-thumb').on("click", function (e) {
      e.preventDefault();
      alert($(this).find('img').attr('alt'));
    });
});


注意
ID
必须是唯一的。
请尝试此代码

$(document).ready(function(){
    $('.product-photo-thumb').on("click", function (e) {
      e.preventDefault();
      alert($(this).find('img').attr('alt'));
    });
});


注意
ID
必须是唯一的。
下面是一个工作示例，其中可以有多个元素具有相同的ID，但它可以正常工作：

下面是一个工作示例，其中可以有多个具有相同ID的元素，但它可以正常工作：

ID在文档上下文中必须是唯一的……为了解释原因，浏览器为ID保留了一个快速查找字典，其中每个ID值都包含一个DOM元素。这意味着
document.getElementById
（因此jQuery也可以）只能看到具有特定ID的第一个出现的元素。@a.Wolff我知道ID必须是唯一的，但我想要一个即使没有唯一ID也能工作的解决方案。@DipakG<代码>即使没有唯一ID也可以工作

为什么？这根本没有道理……。。@A.Wolff您看到下面发布的答案了吗？它在没有唯一ID的情况下工作。ID在文档上下文中必须是唯一的……并解释原因：浏览器为ID保留一个快速查找字典，其中每个ID值包含一个DOM元素。这意味着

document.getElementById

（因此jQuery也可以）只能看到具有特定ID的第一个出现的元素。@a.Wolff我知道ID必须是唯一的，但我想要一个即使没有唯一ID也能工作的解决方案。@DipakG<代码>即使没有唯一ID也可以工作为什么？这根本没有道理……。。@A.Wolff您看到下面发布的答案了吗？它在没有唯一ID的情况下工作。

$(document).ready(function(){
    $('.product-photo-thumb').on("click", function (e) {
      e.preventDefault();
      alert($(this).find('img').attr('alt'));
    });
});

  $(document).ready(function(){
    $("body").on("click",".product-photo-thumb", function (e) {
      e.preventDefault();

      alert($(this).children("img").attr("alt"));
    });
  });