jquery - 在“当前”之前的元素中交换元素中的类

Question

我有一个 div 列表。一个被标记为当前。我需要在一个元素中交换一个类，其中包含当前之前的所有 div。

<div id="1">
    <span class="green"></span>
</div>

<div id="2">
    <span class="green"></span>
</div>

<div id="3" class="current">
    <span class="green"></span>
</div>

<div id="4">
    <span class="green"></span>
</div>

因此，ID 为 1 和 2 的 div 中的“绿色”类应更改为“红色”。当 AJAX 函数成功返回不同的 ID 时，“current”类会发生变化：

var ct = $('.current').attr('id');

$.ajax({
    ...
dataType: "json",

success: function(data){
    var cid = data.cid;

    if (ct != cid) {
        $('div').removeClass('current');
        $('div#'+cid).addClass('current');
    }
}

不确定如何添加 SPAN 类交换。我是否为所有跨度添加 .each() ？那么我如何停止一次并且不改变过去的“当前”？

Answer 1

这是使用 jQuerylt()选择器的理想场所。您必须提取selecteddiv 的索引，然后对索引小于所选索引的所有元素执行操作。

var selectedIndex = $("div.current").index();
var previousDivs = $("div:lt("+selectedIndex+")");

您现在有一个变量previousDivs，其中包含您选择的元素之前的所有元素。

参考 -

• index()
• :lt()