jquery - 选择表格中的多行并拖放到同一个表格中

Question

这里生成一个带有复选框的表格。

<table id="sortable">
    <tr class="myDragClass"><td><input type="checkbox" />row 1</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 2</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 3</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 4</td><td>text text text</td></tr>
    <tr class="myDragClass"><td><input type="checkbox" />row 5</td><td>text text text</td></tr>    
</table>

这是我的java脚本代码:

  $(function () {
    $('#sortable tr').draggable({
        helper: function () {
            var selected = $('#sortableinput:checked').parents('tr');
            if (selected.length === 0) {
                selected = $(this);
            }
            var container = $('<div/>').attr('id', 'sortable');
            container.append(selected.clone());
            return container;
        }
    });

    $('#sortable').droppable({

        tolerance: 'pointer',
        drop: function (event, ui) {
            debugger;
            // $(this).append(ui.helper.children());
            var _GetVal = ui.helper.children();
            alert(ui.helper.children());
        }
    });

});

这里已完成选择和移动，但是何时将其添加移动记录移动到最后一个位置。但我想移动特定位置 `

这里使用复选框选择多行，我想一次移动多行。像(2&3)一样持续下去。所以这是我的行顺序，例如 1,4,5,2,3。我想移动(意味着拖放)同一个表中的行

Answer 1

既然你使用的是 jQueryUI，为什么不对表格使用“sortable”呢？

$("#sortable tbody").sortable({
}).disableSelection();

这是一个工作示例: http://bootply.com/60250