如何在两个容器之间拖放元素

Question

我有两个 table 的名字 Table 1 和 Table2每个 table 包含两行。

我可以在同一个 table

中拖放元素

你能告诉我是否可以将 Table 行从 Table 1 拖放到 Table 2，反之亦然（在不同 [=34= 内移动行]s)

这是我的 HTML 两个 table

<h2>Table 1:</h2>
        <div id="table1" >
            <table>
                <tbody>
                    <tr>
                        <td>Table 1 First Row</td>
                    </tr>
                    <tr>
                        <td>Table 1 Second Row</td>
                    </tr>
                </tbody>
            </table>
        </div>
 <hr/>
    <h2>Table 2:</h2>
   <div id="table2">
            <table>
                <tbody>
                    <tr>
                        <td>Table 2 First Row</td>
                    </tr>
                    <tr>
                        <td>Table 2 Second Row</td>
                    </tr>
                </tbody>
            </table>
        </div>

和我的js代码

$("tbody").sortable({

});

这是我的fiddle

https://jsfiddle.net/wdy1ty89/7/

Answer 1

来自jQuery UI:

$("tbody").sortable({connectWith:"tbody"});

您应该在用户可以拖动元素的位置应用最小宽度和高度：

table{
  padding:5px 0; // To have a min height of 10px
  min-width:100px;
}

勾选this Fiddle