Jquery属性等于选择器只选择第一个元素 - Jquery attribute equals selector only selects the first element

Jquery attribute equals selector only selects the first element

我的equals选择器只选择列表中的第一项。不管我点击哪个图像，它总是将我的jQuery变量设置为第一项。谢谢

//PHP
<div class="imgContain">
<img id="finalimg" alt="first" src="website.com/imga546.jpg">
<img id="finalimg" alt="second" src="website.com/imga645.jpg">
<img id="finalimg" alt="thrid" src="website.com/imga6786.jpg">
<img id="finalimg" alt="4th" src="website.com/imga31234.jpg">
</div>

//jQuery   
$('.imgContain').on("click", "img", function () {
         var srcc = $('img[id="finalimg"]').attr('src');
         var linkU = $('img[id="finalimg"]').attr('alt'); 
       });

由于id必须是唯一的，因此需要使用类：

<div class="imgContain">
    <img class="finalimg" alt="first" src="website.com/imga546.jpg">
    <img class="finalimg" alt="second" src="website.com/imga645.jpg">
    <img class="finalimg" alt="thrid" src="website.com/imga6786.jpg">
    <img class="finalimg" alt="4th" src="website.com/imga31234.jpg">
</div>

然后，您可以使用.按类定位元素，也可以使用$(this)使用类finalimg:获取对当前单击图像的引用

$('.imgContain').on("click", ".finalimg", function () {
    var srcc = $(this).attr('src');
    var linkU = $(this).attr('alt'); 
});

Fiddle演示

点击图像即可获得图像的唯一ID，并按如下操作
工作小提琴演示http://fiddle.jshell.net/8kmdt/

<div class="imgContain">
<img id="img1" alt="first" src="website.com/imga546.jpg">
<img id="img2" alt="second" src="website.com/imga645.jpg">
<img id="img3" alt="thrid" src="website.com/imga6786.jpg">
<img id="img4" alt="4th" src="website.com/imga31234.jpg">
</div>
then change your jQuery code to:
$('.imgContain').on("click", "img", function () {
var getID=$(this).attr("id");
  var source = $("#"+getID).attr('src');
  var linkOfImg = $("#"+getID).attr('alt'); 
});

元素id必须是唯一的。您应该使用类。