Question

我有一个图像列表，我正在尝试使用Jquery从当前元素中查找下一个图像ID。但我似乎无法让jquery工作。

<div class="grid" style="position: relative;">
 <div class="preview">
  <img src="1.jpg" id="175" alt="">
 </div>
</div>
<div class="grid" style="position: relative;">
     <div class="preview">
      <img src="2.jpg" id="176" alt="">
     </div>
    </div>
<div class="grid" style="position: relative;">
     <div class="preview">
      <img src="3.jpg" id="177" alt="">
     </div>
    </div>

的JavaScript

var childId=6;
$( ".grid" ).click(function() {
        var image=$(this).find("img");
        var imageId=image.attr("id")
        show_image(imageId,childId);
    });

function show_image(imageId,childId){
  //need to get next image id in the group for next button , but code below is returning undefined
  var nextImageId=$(".grid .preview #" + imageId).next("img").attr("id");
}

Answer 1

在这种情况下，您不能直接使用.next()，因为图片彼此不是siblings使用，

var nextImageId= $("#" + imageId).closest('.grid').next(".grid").find('img').attr("id");

Answer 2

使用它，它会在'nextImageId'变量中为您提供图像ID。

$( ".grid" ).click(function() { 
     var nextImageId = $(this).closest('.grid').next(".grid").find('img').attr("id");   
});

Answer 3

使用next（）获取下一个网格选择器，然后找到img

 $(".grid").click(function () {
    var image = $(this).find("img");
    var imageId = image.attr("id")

   var nextImageId= $(this).next(".grid").find("img").attr("id")  // get next image id
});

Jquery获取下一个元素的图像ID

3 个答案: