如何找出点击元素的位置？

Question

我如何知道列表项目在什么位置被点击。

所以，让我们说我点击第二个列表项：

<li><a href="#"><span>Tab 2</span></a></li> 

然后，我会得到一个警告说类似：

你点击第二个列表项？

jQuery代码

$('#top-betting ul li:first').addClass('current'); 
$('#top-betting div:not(:first)').hide(); 

$('#top-betting ul li span').click(function() 
{ 
    ...? 
}); 

标记

<div id="tabs"> 
    <ul class="clearfix"> 
     <li><a href="#"><span>Tab 1</span></a></li> 
     <li><a href="#"><span>Tab 2</span></a></li> 
     <li><a href="#"><span>Tab 3</span></a></li> 
    </ul> 

    <div>Content 1</div> 
    <div>Content 2</div> 
    <div>Content 3</div> 
</div> 

Answer 1

可以使用.closest()和.index()这样做：

$('#top-betting ul li span').click(function() { 
    var index = $(this).closest('li').index(); 
}); 

总体而言，I think this is what you're after：

$('#top-betting ul li span').click(function() { 
    $("#top-betting div").eq($(this).closest('li').index()).show() 
         .siblings('div').hide(); 
});​ 

Answer 2

您正在寻找的index method。

Answer 3

index是你以后的方法。

$('li a').click(function(e){ 
     var $li = $(this).parents('li'); 
     var $ul = $(this).parents('ul'); 
     alert($ul.children().index($li)); 
    }); 

检查的jsfiddle：http://jsfiddle.net/9V9D2/