Question

我正在尝试创建脚本，这将允许我与其他元素同时对某些元素进行排序。我创建了简单的jsfiddle来演示我正在尝试的内容。我有两行数字1-5，但排序只是顶线。

<div class="demo1 demo">
    <div id="sortable">
        <div class="test">1</div>
        <div class="test">2</div>
        <div class="test">3</div>
        <div class="test">4</div>
        <div class="test">5</div>
    </div>
</div>
<div class="demo2 demo">
    <div>
        <div class="test">1</div>
        <div class="test">2</div>
        <div class="test">3</div>
        <div class="test">4</div>
        <div class="test">5</div>
    </div>
</div>

$("#sortable").sortable({

});

jsfiddle here 我的目标是创建脚本，它将同时移动底部div，就像移动顶部div一样。

Answer 1

我发现工作示例here非常干净且有用的解决方案

var lst, pre;

$(".sortlist").sortable({
    start:function(event, ui){
        pre = ui.item.index();
    },
    stop: function(event, ui) {
        lst = $(this).attr('id');
        post = ui.item.index();
        other = (lst == 'list1') ? 'list2' : 'list1';
        //Use insertBefore if moving UP, or insertAfter if moving DOWN
        if (post > pre) {
            $('#'+other+ ' div:eq(' +pre+ ')').insertAfter('#'+other+ ' div:eq(' +post+ ')');
        }else{
            $('#'+other+ ' div:eq(' +pre+ ')').insertBefore('#'+other+ ' div:eq(' +post+ ')');
        }
    }
}).disableSelection();

通过jQuery ui sortable（）移动多个元素

1 个答案: