Jquery 带有可排序表的克隆div允许拖动，但不允许排序

当我需要动态添加div块时，我有一个web表单。在div块中有一个可排序的项目表。我通过在最后一个div上调用clone（）来添加div及其子级，并根据需要修复输入（代码被接受，因为它与测试无关）。并将新克隆的div附加到最后一个div的父级。然而，无论我怎么做，我都无法使新克隆的div w/child表像它的预处理器一样可排序

我已经在JSFIDLE上设置了显示问题的程序

对于那些看不到JSFIDLE的人，这里有一些相关的信息可以尝试：

HTML部分：

<div>
    <div class="inner">
        <input name="one" value="something" />
        <table>
            <tbody>
                <tr>
                    <td>First</td>
                    <td>
                        <input name="row1" value="1" />
                    </td>
                </tr>
                <tr>
                    <td>Second</td>
                    <td>
                        <input name="row2" value="2" />
                    </td>
                </tr>
                <tr>
                    <td>Third</td>
                    <td>
                        <input name="row3" value="3" />
                    </td>
                </tr>
                <tr>
                    <td>Fourth</td>
                    <td>
                        <input name="row4" value="4" />
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <br/>
</div>
<input type="button" id="button" value="Add" />

是否有方法重新应用新克隆表的可排序性？我们使用的是jQuery 1.7.1和jQuery UI 1.8.13。

克隆不包含数据和事件的表（使用事件克隆它意味着新表的行要排序到旧表中），然后使表可排序，而不是原始div。（为了方便，您还可以链接方法。）

---

您还可以将

.appendTo（$（'div.inner:last'）.parent（））

替换为

.insertAfter（'div.inner:last'）

for（您还有一个

，它根据您使用的代码而改变位置）。

这很有意义。在我的“真实”代码中，我在表中有一堆按钮用于删除行，我希望保留它们的单击事件，这就是为什么我选择克隆路径，而不是仅仅构建DOM并添加它。但是，我想如果我想让排序与克隆一起工作，我必须将好的与坏的结合起来。如果将这些单击事件附加到公共父元素，它们将被附加到父元素，而不必担心克隆它们：

$（'common-parent-selector'）。on（'click'，'button-selector'，function（）{…}）

jQuery从未停止让我惊讶：）。

$(document).ready(function () {
    $('div.inner table tbody').sortable({
        stop: function () { /* Some code to reset the row numbers */
        }
    });

    $('#button').click(function(event) {
        var newInnerDiv = $('div.inner:last').clone(true,true);

        // clean up the inputs

        // Append the new Item Type to the parent of the existing one
        $(newInnerDiv).appendTo($('div.inner:last').parent());

        // renumber inputs

        // Even if I make this re-sortable, the new table doesn't work
        $(newInnerDiv).sortable();
    });
});

    var newInnerDiv = $('div.inner:last').clone(false,false)
        .appendTo($('div.inner:last').parent())
        .find('tbody').sortable();