Question

如果点击当前的alert(index)

，我想<p>

    <p>1</p>
    <p>2</p>
    <p>3</p>
    <p>4</p>
    <script>
       $("p").click(function(){
          for(i=0;i<$(this).length;i++) {
              if($(this).eq(i).data("clicked",true))
                  {
                      alert(i);
                  }
          }
         }) 
    </script>

我尝试了这段代码，但只要点击就会显示0。我想看一下带有alert的当前索引。当我点击第二个<p>时，它应显示为1。

Answer 1

在原始代码中，您设置了循环的上限，如下所示：

for(i = 0; i < $(this).length; i++)

this将仅引用您点击的一个元素，因此$(this).length始终为1，其索引始终为0。

此外，您的测试是：

if($(this).eq(i).data("clicked", "true"))

此语法将数据属性clicked设置为true（不测试以查看值是否为true）。因此，它总会成功，这就是为什么你总是被带到true语句的if分支，然后总是得到0。

要测试该属性，您应该写：

if($(this).eq(i).data("clicked") === "true")

更简单的实现是使用index()。有关index()的详细信息，请参阅 this 。这是一个完整的版本，提醒您是否是第一次点击元素。不需要循环或使用eq()（它使您获得指定索引处的元素而不是索引本身）。

$("p").click(function(){
  // Get the index position of the currently clicked element, within the set of <p> elements
  var idx = $(this).index("p");
  
  // Test to see if the element has already been clicked.
  if($(this).data("clicked") === "true"){
    alert("Element " + idx + " has already been clicked.");
  } else {
    alert("You just clicked element " + idx + " for the first time.");
  }

  // Mark the element as clicked for next time:
  $(this).data("clicked", "true");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>

如何提醒当前索引

1 个答案: