【问题标题】：example jquery get index/position of sibling示例 jquery 获取兄弟的索引/位置
【发布时间】：2012-10-09 15:01:34
【问题描述】：

假设我有以下 html

<ul>
  <li id="a">a</li>
  <li id="b">b</li>
  <li id="c">c</li>
</ul>
<ul>
  <li id="d">d</li>
  <li id="e">e</li>
  <li id="f">f</li>
</ul>

如果我使用 jQuery 抓取项目 $('#e')，我如何确定 e 相对于其兄弟 d 和 f 的位置或位置/索引？换句话说，我希望返回值 1（如果基于零的索引）或 2（如果基于 1 的索引），因为它是 ul 列表中的第二个元素。

【问题讨论】：

标签： javascript jquery indexing

【解决方案1】：

function getIndex(id) {
    $('ul > li').each(function() {
        if ($(this).attr('id') == id) {
            return i;
        }
    });
    return 0;
}

【讨论】：

【解决方案2】：

你也可以使用 var idx = $("#e").prevAll().size()

【讨论】：

【解决方案3】：

你也可以试试这个：

$(function() {
    $('ul li').each(function(idx, e) {
        $(this).on('click', function() {
            alert(idx);
        });
    });
});

唯一的问题是，它目前会将整个页面上的所有li 编入索引。

编辑

这个给出了所有li内容的索引。

$(function() {
    $('ul li').each(function(idx, e) {
        $(this).on('click', function() {
            alert($('#' + $(this).attr('id')).index());
        });
    });
});

【讨论】：

【解决方案4】：

您可以使用.index() 获取元素相对于其兄弟元素的从零开始的索引。

$('#e').index();

http://jsfiddle.net/LXS9F/

【讨论】：

【解决方案5】：

简单：var idx = $('#e').index() // zero based

【讨论】：