jQuery可排序表列：创建额外列

我正在创建一个表，通过拖动列标题可以对列进行排序。 我正在为此使用jquerysortable

下面是我创建的一个JSFIDLE示例：

它起作用了！但是，当您开始向右拖动第一列时，其他列将移出表！它就像是多了一列

有人能解决这种行为吗

HTML代码：

<div style='display:table;'>
    <div id="sortable" class="Row">
       <span id="col1" class="Column">Name</span>
       <span id="col2" class="Column">Age</span>
       <span id="col3" class="Column">City of Birth</span>
    </div>
    <div id="row1" class="Row">
        <span id="row1col1" class="data">Pete</span>
        <span id="row1col2" class="data">48</span>
        <span id="row1col3" class="data">New York</span>
    </div>
    <div id="row2" class="Row">
        <span id="row2col1" class="data">Sarah</span>
        <span id="row2col2" class="data">43</span>
        <span id="row2col3" class="data">Moscow</span>
    </div>
</div>

名称
年龄
出生城市
皮特
48
纽约
莎拉
43
莫斯科

不是最吸引人的解决方案，但您可以将以下代码添加到CSS中：

.ui-sortable-placeholder {

    display: none;

}

---

让我更接近我的解决方案。不是全部答案，因为它没有演示中的那么好，不过还是要谢谢你。现在就可以了！：-）希望其他人有最后的接触！我认为问题在于您将div与表行为一起使用。我认为这是最好的解决方案。这不是最优的，但使用表格可能无法实现完美的解决方案。我也在想，我是否真的希望在一张桌子上有正常的可排序行为。所以这个解决方案对我来说很好！谢谢