jquery - 获取元素相对于整体的索引号，而不仅仅是相对于最近的父 div

Question

我发现了很多关于如何在 jQuery 中做这个非常基本的事情来获取索引号的问题和解决方案。

$(".container p").click(function() {
  var index = $(this).index();
  alert(index);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <p>One</p>
  <p>Two</p>
  <p>Three</p>
</div>

好的，这很好，但显然这是相对于 .container 的。

我怎样才能获得相对于整个页面的索引，这样如果我在页面的一半位置有另一个 .container，下一个页面仍会计算索引。

有道理吗？

Answer 1

要实现这一点，您可以为 index() 提供一个选择器，以便它在其中找到当前元素，如下所示:

$(".container p").click(function() {
  var index = $(this).index(".container p");
  console.log(index);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
  <p>One</p>
  <p>Two</p>
  <p>Three</p>
</div>
<div class="container">
  <p>Four</p>
  <p>Five</p>
  <p>Six</p>
</div>
<div class="container">
  <p>Seven</p>
  <p>Eight</p>
  <p>Nine</p>
</div>