JQuery .index() 不返回元素的正确索引答案

【问题标题】：JQuery .index() doesn't return the right index for the elementJQuery .index() 不返回元素的正确索引
【发布时间】：2013-10-30 10:19:01
【问题描述】：

首先是我的 HTML：

<h2>
  <a href=[...]>
    <expander>
      SomeText
</expander>
  </a>
</h2>

<h2>
  <a href=[...]>
    <expander>
      SomeText
</expander>
  </a>
</h2>

现在是 Javascript/JQuery：

$("expander").on("click", function(){
    var blubb = $(this).index();
            alert(blubb)
});

我的问题是“警报”（实际上是“blubb”变量）总是抛出零。如果我单击第二个扩展器，它不应该给出“1”吗？

谢谢！

问候

【问题讨论】：

不，因为他们有不同的父母，你应该申请<h2>
啊对...谢谢！ Arun 在那里帮我工作 :) 谢谢！

标签： javascript jquery html indexing

【解决方案1】：

由于expander 是其父索引的第一个也是唯一一个子索引，因此将始终返回0。

试试这个：

var blubb = $(this).closest('h2').index();

演示

Try before buy

【讨论】：

【解决方案2】：

您需要这样做才能获得正确的 expander 索引：

$("expander").on("click", function (e) {
    e.preventDefault();
    var blubb = $("expander").index(this);
    alert(blubb)
});

Fiddle Demo

【讨论】：

【解决方案3】：

.index() 不带任何参数将给出元素相对于其兄弟元素的索引

在您的情况下，您需要找到点击的扩展器相对于页面中扩展器元素的索引，因此请尝试

var $expanders = $("expander").on("click", function(){
    var blubb = $expanders.index(this);
    alert(blubb)
});

演示：Fiddle

【讨论】：

哇！工作！谢谢！顺便说一句，有道理;P
@user176270 由于您是 Stackoverflow 的新手：如果此答案对您帮助最大，请使用绿色复选标记接受。它将帮助未来的访问者查看哪一个解决了您的问题。