Question

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

这是下一个按钮的功能：

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（s）的下一个跨度。

 <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>

这是我的其中一个。怎么了？

Answer 1

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

$('.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();          
});

Answer 2

如果每个具有“地址”类的div都按照您的代码构造，您可以尝试：

var current = $(this).parent().find('.active');

为什么所有跨度都改变而不是一个？

2 个答案: