Question

我正在使用这个Sortable plugin by Rubaxa，在我的帮助下，我想用“块”类对我的嵌套表进行排序。

HTML

<table id="table">
    <tbody>
        <tr class="block">
            <td>
                <table>
                    <tr>
                        <td>item 1</td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr class="block">
            <td>
                <table>
                    <tr>
                        <td>item 2</td>
                    </tr>
                </table>
            </td>
        </tr>
    </tbody>
</table>
<div id="div">
    <div class="block">1</div>
    <div class="block">2</div>
</div>

JS

var el = document.getElementById('table'),
    newEl = document.getElementById('div');
new Sortable(el, {
    draggable: '.block'
});
new Sortable(newEl, {
    draggable: '.block'
});

但是我不能让它与表一起工作。这个插件是否只允许直接儿童排序？是因为表的结构不起作用？或者是出于其他原因？

jsFiddle link

Answer 1

它仅适用于一级儿童：

<强>解决方案

广告tbody

的ID

<tbody id="rows">

使用此ID进行排序。

el = document.getElementById('rows')

Working example

Answer 2

我也有同样的问题，在这里找到了一个很好的答案。

<tbody id="sortrows">

var sort = new Sortable(sortrows, {
onSort: function (evt) {
    console.log(evt.oldIndex + ' -> ' + evt.newIndex);
    document.getElementById('displayText').innerHTML=evt.oldIndex + ' -> ' + evt.newIndex;
} });

添加Working example

可排序的js none-jquery插件对div进行排序，但不对表进行排序

2 个答案: