Question

有没有办法使用jQuery将列表项与另一个项交换？

假设此列表：

<ul>
    <li id="1"></li>
    <li id="2"></li>
    <li id="3"></li>
    <li id="4"></li>
    <li id="5"></li>
</ul>

如何使用第4项更改第2项？

这样它

<ul>
    <li id="1"></li>
    <li id="4"></li>
    <li id="3"></li>
    <li id="2"></li>
    <li id="5"></li>
</ul>

有没有办法不使用绝对定位？

Answer 1

$('#2').insertAfter($('#3'));
$('#4').insertAfter($('#1'));

<强> jsFiddle example

Answer 2

var lis = $('ul li');
lis.eq(3).after(lis.eq(1)).end().eq(0).after(lis.eq(3));

http://jsfiddle.net/Px6be/

只是为了好玩：

$.fn.swap = function(elem) {
    var elem = $(elem),
        before = elem.prev();

    this.after(elem);
    before.after(this);
};

$('#2').swap('#4');

http://jsfiddle.net/Px6be/1/

Answer 3

您可以查看名为“Sortable”的jQuery库。您可以在这里阅读并查看现场演示：http://jqueryui.com/sortable/

使用jQuery将列表项与另一个项交换？

3 个答案: