Question

我已经尝试将列表中的最后一个元素移动到点击的第一个位置，但它不起作用。我是根据这个问题的答案做到的：Move last child to first position。 Firebug告诉我列表中发生了一些事情，但它肯定不是最后一次改变:(

jQuery的：

$(document).ready(function(){   
    $(".carousel-button-left").click(function(){
    var $ul=$(this).next();                 
    var $lastchild=$ul.children().last();
    $ul.prepend($lastchild);
    });
});

HTML：

<div class="testowyDiv">
    <img class="carousel-button-left" src="ikony/strzalkal.png">
    <div class="testowyDiv2">
        <ul class="testowyUl">
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>7</li>
            <li>8</li>
            <li>9</li>
        </ul>
    </div>
    <img class="carousel-button-right" src="ikony/strzalkap.png">
</div>

Answer 1

$(document).ready(function(){   
    $(".carousel-button-left").click(function(){
    var $ul=$(this).next().find(".testowyUl");   // by next we reach on next div then by find we reach on ul               
    var $lastchild=$ul.children().last();
    $ul.prepend($lastchild);
    });
});

Answer 2

$(document).ready(function(){   
    $(".carousel-button-left").click(function(){
    var $ul=$(".testowyUl");  //do you need node traversing, if not use direct, better keep a id for it 
    var lastchild=$ul.children().last();
        console.log(lastchild.val());
    $ul.prepend(lastchild);
    });
});

Demo -Fiddle

Answer 3

使用prepend或insertBefore。

样品：

$(document).ready(function(){   
    $('.carousel-button-left').click(function() {
        var first = $('.testowyUl li:first');
        var last = $('.testowyUl li:last');
        last.insertBefore(first);
    });
});

将最后一个孩子移动到第一个位置不起作用jquery

3 个答案: