jquery - 通过Jquery索引定位div内的img元素

Question

您好，我正在尝试显示星级，我有如下所述的 HTML 结构

<div class="ImagesDetails"><div><img src="grey.png"/></div><div><img src="grey.png"/></div><div><img src="grey.png"/></div><div><img src="grey.png"/></div><div><img src="grey.png"/></div></div>

然后我将从 ajax 响应中获取评级值。 现在我需要在 div 中将星级图像从灰色图像更改为黑色图像，直到通过 jquery 计数为止，如下所述。

var rating = 3

<div class="ImagesDetails"><div><img src="black.png"/></div><div><img src="black.png"/></div><div><img src="black.png"/></div><div><img src="grey.png"/></div><div><img src="grey.png"/></div></div>

我正在像这样获取特定 div 的索引

$('.ImagesDetails').eq(k).find('div').each(function(){
  var xyz = $(this).index();
});

这里的 k 是 ajax 响应的索引。请给我建议解决方案。

Answer 1

您可以使用 :lt() 这里的选择器:

Select all elements at an index less than index within the matched set.

$('.ImagesDetails img:lt('+ rating  +')').attr("src","black.png")