javascript - 获取 HTML 列表中项目的位置

Question

我需要知道一个项目在 HTML 列表中的位置。

<ul>
  <li>first</li>
  <li>second</li>
  <li>third</li>
</ul>

$('ul').on("click", function(event){
  var target = event.target;
})

所以当我得到第一个li作为事件的目标时。我怎样才能得到0项目位置的结果。我能想到的唯一方法是遍历所有项目并将它们与事件目标进行比较，但我想知道是否有更好的方法来解决这个问题。

score 3 · Accepted Answer

你可以使用：

$('ul').on("click", function(event){
  var target = event.target,
      index = $(target).index();
  console.log(target, index);
})

参考：

score 2 · Accepted Answer

2

var listItem = $(event.target);
alert('Index: ' + $('ul > li').index(listItem));

于 2013-03-04T14:32:27.480 回答

score 1 · Accepted Answer

$('ul li').on("click", function(){
var index = $(this).index();
alert(index);
})

3 回答 3