javascript - jQuery索引发现

Question

<div class="es-carousel">
    <ul>
        <li><a><img src="something157.jpg" ></a></li>
        <li><a><img src="blabla.jpg"></a></li>
        <li><a><img src="nonsense.jpg"></a></li>
        <li><a><img src="cthulhu.jpg"></a></li>
    </ul>
</div>

上面是html。

用于查找具有正确 src 的 img 的 jQuery 选择器：

$(".es-carousel").find("ul li a img[src*='something']")

问题是我需要找到该图像所在的 li 的索引。（我计划为此使用 .index() ）我不知道如何选择具有该图像的精确 li。

谁能告诉我正确的方向或给我一个想法？感谢所有帮助。

Answer 1

从 img 开始，逐步向上：

$(".es-carousel").find("img[src*='something']").parents('li').index();

http://jsfiddle.net/zyvTD/

Answer 2

:has()在这种情况下index()会帮助你

$(".es-carousel").find("ul li:has(a img[src*='something'])").index();

Answer 3

您可以使用 jQuery 的 parents 方法来获取包含您正在选择的 img 的适当 li 元素。试试下面的选择器。

$(".es-carousel").find("ul li a img[src*='something']").parents("li");

谢谢，

约蒂

Answer 4

使用 i/index 参数创建每个函数，在每个函数中，您在子项中搜索该图像，并在找到图像的位置输出索引。

样本：

var somethingVar = XxXX;

jQuery('.my-list li').each(function(index){
    var foundImage = jQuery(this).find('a img[src*='somethingVar']');
    if(foundImage.length) {
        console.log('Your index is ' + index);
    }
})