索引号点击次数

Question

尝试在UL中显示一堆点击链接的索引。

<ul class="menu">
    <li><a href="#">Slide 1</a></li>
    <li><a href="#">Slide 2</a></li>
    <li><a href="#">Slide 3</a></li>
</ul>

$(".menu li a").click(function(e){
    e.preventDefault();
    slideIndex = $(this).index();
    console.log(slideIndex);

});

现在在控制台中它只显示0，我在这里错过了什么？如果我点击其他2个链接，我希望它显示1或2。我想这可能是基本的，但我有点不确定。

Answer 1

将其更改为：

$(".menu li").click(function(e){
    e.preventDefault();
    slideIndex = $(this).index();
    console.log(slideIndex);

});

否则，您正在检查a中li的索引，该索引始终为0，因为每个a中只有一个li。

Answer 2

您应该像

那样到达<li>元素索引

$(".menu li a").click(function(e){
    e.preventDefault();
    slideIndex = $(this).parent().index();
    console.log(slideIndex);

});

Answer 3

试试这个

<ul class="menu">
    <li><a href="#" data-ind='1'>Slide 1</a></li>
    <li><a href="#" data-ind='2'>Slide 2</a></li>
    <li><a href="#" data-ind='3'>Slide 3</a></li>
</ul>

$(".menu li a").click(function(e){
    e.preventDefault();
    var slideIndex = $(this).data('ind');
    console.log(slideIndex);

});