javascript - 如何识别图片id标签不是静态的点击图片？

Question

我有一个使用 PHP 代码从服务器显示在 html 中的图像列表

这是 div 中的 PHP 代码:

while($row = $result->fetch_assoc()) {
    echo "<div class='col-lg-3 col-md-4 col-xs-6 thumb'><a class='thumbnail' href='#'><img id='template" . $row["imageName"]. "' class='img-responsive' src='../images/templates/" . $row["imageName"].".". $row["imageExtension"]."' alt='error' width='333px' height='262px' class='img-thumbnail' onClick='changeImage()'></a></div>";
}

PHP 代码循环服务器中的每个图像并创建另一个 div，其中是 img。

现在，我的问题是如何识别点击的具体图像？我无法使用 document.getElementById(''); 因为首先我不知道 ID，对吧？虽然我通过添加 id='template". $row["imageName"]." 使每个图像都具有唯一的 ID，这意味着每个图像的假定 ID 是 template[x] 其中 x 是数据库中的图像名称。

我正在努力如何识别用户点击的特定图像。

有什么方法可以识别图像吗？

Answer 1

这样做:

$("img").click(function(){
   alert("Image ID is: " + $(this).attr("id"));
});

这将显示您在弹出窗口中单击的图像的 ID。

基本上，上面的代码等待页面上任何 img 元素的点击。

单击img 后，您只需检索单击的元素 的“id”属性，可以引用该元素>$(this)，因此将其显示在警告框中。