将最后一个子项移到第一个位置不适用jquery

moving last child to first position does not work jquery

本文关键字:第一个 位置 不适用 jquery 最后一个      更新时间:2023-09-26

我尝试在单击时将列表中的最后一个元素移动到第一个位置,但不起作用。我是根据这个问题的答案做的:把最后一个孩子移到第一个位置。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>
$(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);
    });
});
$(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);
    });
});

演示-Fiddle

使用prepend或insertBefore。

样品:

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