为什么所有跨度都被更改而不是一个跨度

Why all the spans are changed instead of one?

本文关键字：一个 为什么      更新时间：2023-09-26

我有上一个和下一个按钮：

这是下一个按钮的功能：

var nextFn = function(e)
    {
        var current = $('.active');
        alert(current);
        var prev = $('#prev');
        pos = $('.active').attr('id');
        $("#num").text('(' + pos + '/' + researchPlaces.length + ')');

        $(current).next().attr("class", "active");
        $(current).attr("class", "passive"); 
        //e.stopPropagation();          
    };

当我单击"下一步"时，它应该显示下一个跨度。但是，它也显示页面中其他li中的下一个跨度。

 <li class="memberElement" style="width: 100%; padding: 10px 0 10px 0; border-bottom: 1px solid #ccc;">
    <div class="MemberImageHolder" style="float:left">
        <a href="#">
            <img class="memberpic" src="picture.php?action=display&amp;contentType=members&amp;id=5&amp;quality=medium" alt="">
        </a>
    </div>
    <div class="memberDetails">
        <a href="#!uottawa/members/5/profile">Charles Darwin</a>
        <div id="title">Professor</div><div id="unit">
            <b>University of Ottawa</b>
        </div>
        <div id="address">
            <a id="prev">Prev </a>
            <span id="1" class="active">150 York Street</span>
            <span id="2" class="passive">80 Elgin Street</span>
            <span id="num" class="passive">(0/2)</span>
            <a id="next"> Next</a>
        </div>
    </div>
    <span class="divider"></span>
</li>

这是我的一个李。怎么了？

我认为是因为您的选择器：

$('.active');

此选择器选择所有具有活动类的控件。我猜你在每个li中有一个活动跨度。

要修改类，您应该使用addClass而不是修改属性：

$(current).next().addClass("active");
$(current).removeClass("passive");

这样你就不会失去与你的控制相关的其他类。

编辑：

你可以通过点击链接获得li：

$("#prev").click(function()
{
    var li = $(this).closest("li");
    var current = $(li).find('.active');
    alert(current);
    var prev = $('#prev');
    pos = $('.active').attr('id');
    $("#num").text('(' + pos + '/' + researchPlaces.length + ')');

    $(current).next().attr("class", "active");
    $(current).attr("class", "passive"); 
    //e.stopPropagation();          
});

如果每个类为"address"的div的结构与代码中的一样，您可以尝试：

var current = $(this).parent().find('.active');
相关文章：