Question

我正在尝试选择我以前的.item

我有这个：

<div id="um" class="item">um</div>
<div id="dois" class="item">dois</div>
<div id="tres" class="item active">tres</div>
<div id="quatro" class="item">quatro</div>
<div id="cinco" class="item">cinco</div>

<button id="prev>previous</button>

我正在尝试这个：

 $("#prev").click(function(){
  $(".active").addClass("after").removeClass("active");
  $(".after").prev(".item").addClass("active");
  $(".after").removeClass("after");
  });

我未能找回之前的.item

任何人都可以帮助我吗？

Answer 1

工作正常，你需要关闭按钮id属性的引用。

<button id="prev">previous</button>

见这里：http://jsfiddle.net/4YLjg/

更新

根据评论中的链接，您的prev点击监听器是在next点击监听器中定义的，因此每次单击下一个按钮时，它都会生成一个新的prev监听器每次单击下一个按钮时，prev会再次触发{{1}} ...

请在此处查看工作版本：http://codepen.io/anon/pen/cGrvq

Answer 2

您不必使用其他类重载JS。你试过这个：

$("#prev").click(function(){
  var prev = $(".active").prev();
  $(".active").removeClass("active");
  prev.addClass("active");
});

有一个很好的例子，比如你想在jQuery官方prev（）页面上做什么：http://api.jquery.com/prev/

Answer 3

Working Demo

您需要将两个点击处理程序分开。之前的点击是在net之前的处理程序中。
此外，您需要处理没有前一个元素的事件。对于um按上一个。

下一步：

$("#next").click(function () {

    // SETANDO A CONTAGEM DE ITENS
    var len = $(".active.item").next(".item").length;

    // ADICIONANDO O PRÓXIMO ITEM
    $(".active").addClass("before").removeClass("active");
    $(".before").next(".item").addClass("active");
    $(".before").removeClass("before");

    // SE FOR O ÚLTIMO ITEM, RETORNE AO PRIMEIRO

    if (len <= 0) {
        $(".active").addClass("before").removeClass("active");
        $(".item").first().addClass("active");
        $(".before").removeClass("before");
    }


});

$("#prev").click(function () {
    var len = $(".active.item").prev(".item").length;


    $(".active").addClass("after").removeClass("active");
    $(".after").prev(".item").addClass("active");
    $(".after").removeClass("active").removeClass('after');
    console.log(len);

    if (len <= 0) {
        $(".active").addClass("after").removeClass("active");
        $(".item").last().addClass("active");
        //$(".after").removeClass("before");
    }
});

获取前一个元素

3 个答案:

Working Demo