我有n个列表项。我需要得到没有类活动的项目

时间:2016-08-25 13:00:17

标签: javascript jquery html

我正在制作一个滑块,它会在点击下一个和上一个时更改活动类,我希望每次都有第二个具有类活动的子节点。 例如在当前情况下它应该返回3

HTML

<div class="my-list">
    <ul>
        <li><a href="#"> list item</a></li>
        <li><a href="#"> list item</a></li>
        <li class="active"><a href="#"> list item</a></li>
        <li><a href="#"> list item</a></li>
        <li><a href="#"> list item</a></li>
        <li><a href="#"> list item</a></li>
        <li><a href="#"> list item</a></li>
    </ul>
</div>

的JavaScript

function getCurrentItem() {
    var listItem = $(".my-list ul li");
    var items = [];
    for (i = 0; i < listItem.length; i++) {
        items[i] = listItem;
        if($(items[i]).hasClass("active")){
            console.log("here: "+i);
        }
    }
}
 getCurrentItem();

3 个答案:

答案 0 :(得分:2)

index()可用于元素的索引。请注意,index()将返回元素的从零开始的索引。因此,在当前示例中,它将返回2.

return $('.my-list li.active').index();

如果索引需要从1开始,请在零基索引中添加一个。

return $('.my-list li.active').index() + 1;

console.log($('.my-list li.active').index() + 1);
.active {
  color: green;
  font-weight: bold;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="my-list">
    <ul>
        <li><a href="#"> list item 1 </a></li>
        <li><a href="#"> list item 2</a></li>
        <li class="active"><a href="#"> list item 3</a></li>
        <li><a href="#"> list item 4</a></li>
        <li><a href="#"> list item 5</a></li>
        <li><a href="#"> list item 6</a></li>
        <li><a href="#"> list item 7</a></li>
    </ul>
</div>

答案 1 :(得分:1)

您可以使用index()

执行此操作
var currentActive = $('li.active').index() + 1; // 3, in this case

答案 2 :(得分:1)

function getCurrentItem() {
    var listItem = $(".my-list ul li");
    for (i = 0; i < listItem.length; i++) {
        if ($(listItem[i]).hasClass("active")) {
            console.log("here: " + i);
            return i + 1; //weve found it, lets return
            break;
        }
    }
    return " empty";
}
alert(getCurrentItem()); //should alert 3 in your case