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