jquery - 如何获取 jQuery 对象中元素相对于对象的索引？

Question

如果我有一个由多个 jQuery 对象组成的对象，那就是：

var $listItems $('ul.list1 li').add($('ul.list2 li'));

如何获取数组中任何元素的索引，即：

$listItems.click(function() {
    console.log($(this).index());
});

这对我不起作用，因为当单击第二个列表中的项目时，显然索引是相对于 DOM 的索引，而不是 jquery 对象。

我怎样才能得到索引？

http://jsfiddle.net/ZdCsu/

Answer 1

相对索引在 jQuery 中总是有点麻烦，因为堆栈中的元素可能与索引没有任何逻辑关系。

你可以这样做：

$('#list_one li').add('#list_two li').each(function(index) {
    //assign a contrived index to each element in turn, relative to the stack
    $(this).data('stack-index', index);
}).on('click', function() {
    //then retrieve it on click
    alert($(this).data('stack-index'));
});

此外，在您发布的特定示例中，不需要add()，但也许在您的真实代码中存在。

Answer 2

您可以做的是将 jQuery 对象转换为数组：

var $listItems = $('ul.list1 li').add($('ul.list2 li'));

$listItems.click(function() {

    console.log($listItems.toArray().indexOf(this));

});​

您更新的jsfiddle