Question

我想从父树中获取div元素的索引：

$(".row .col a").click(function() {
  var e = $(this).parent();
  var p = e.parent();
  var i = p.index(e);
  console.log([e, p, i]);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="row">
    <div class="col"><a>link 1</a>
    </div>
    <div class="col"><a>link 2</a>
    </div>
  </div>
</div>

但索引总是-1。第一个链接应该是0和第二个链接1.你如何获得这种html结构的索引？

Answer 1

index()获取父元素中的元素索引。由于只有一个.row类元素，index()会返回索引0，因为它是从零开始的。

要获取被点击元素的索引，请获取最近的祖先.col并在其上调用索引。

$(this).closest('.col').index()

Demo

$(".row .col a").click(function() {
  console.log($(this).closest('.col').index());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="row">
    <div class="col"><a>link 1</a>
    </div>
    <div class="col"><a>link 2</a>
    </div>
  </div>
</div>

如何在JQuery中获取父元素的索引

1 个答案: