0

ID が添付された一連の div を含むクラスがあります。jQuery を使用して、これらの div を動的に循環させようとしています。

私のHTML：

                <div id ="result">RESULT GOES HERE</div>

                <div class = "tplandesclist">
                    <div id="tplandesc1"><%= tplan.tplandesc %></div>
                    <div id="tplandesc2"><%= tplan.tplandesc2 %></div>
                    <div id="tplandesc3"><%= tplan.tplandesc3 %></div>
                    <div id="tplandesc4"><%= tplan.tplandesc4 %></div>
                    <div id="tplandesc5"><%= tplan.tplandesc5 %></div>
                    <div id="tplandesc6"><%= tplan.tplandesc6 %></div>
                    <div id="tplandesc7"><%= tplan.tplandesc7 %></div>
                    <div id="tplandesc8"><%= tplan.tplandesc8 %></div>
                </div>

クリックすると、#result の html を消去し、親 div .tplandesclist の下に次の項目を追加しようとする jQuery です。ただし、これを実行しようとしている方法に問題があることはわかっています。ある種のカウンターを実装してアルゴリズムを完全に書き直す代わりに、.next() メソッドを使用してそれを実行しようとしています。

    $(document).ready(function(){
     $(".arrow").click(function(){

     $("#result").html(' ');
     $("#result").append().find(".tplandesclist")).next()

      });
     });

どんな助けでも大歓迎です！

4

1 に答える 1

4

試す

$(document).ready(function(){
    var $list = $(".tplandesclist > div");
    $(".arrow").click(function(){
        var $next = $list.filter(".current").removeClass('current').next();
        if(!$next.length){
            $next = $list.first()
        }

        $next.addClass('current')
        $("#result").html('').append($next.clone());

    });
});

デモ:フィドル

于 2013-09-17T03:23:51.040 に答える