jquery ui可排序范围和嵌套排序

Question

我的Html：

<div class="demo">
    <div id="sortable" class="ui-state-default">
        <div id = "draggable1" class="">Home</div>
        <div id = "draggable2" class="">Contact Us</div>
        <div id = "draggable3" class="">
            <table id='srtTable'>
                <tr>
                    <td>tbl1</td>
                    <td>tbl2</td>
                    <td>tbl3</td>
                    <td>tbl4</td>
                </tr>
            </table>
            FAQs</div>
        <div id = "draggable5" class="Test">Test1</div>
        <div id = "draggable6" class="Test">Test2</div>
        <div id = "draggable7" class="Test">
             <table id='srtTable1'>
                <tr>
                    <td>tbl1</td>
                    <td>tbl2</td>
                    <td>tbl3</td>
                    <td>tbl4</td>
                </tr>
            </table>
            Test3</div>
    </div>
</div>

和jquery：

$("#sortable").sortable({
   items: ":not(#draggable3,#draggable7)"
});

$("Table tr td").sortable({
   connectWith:'#' + $(this).parents().find(table).attr('id')
});

但是td正在表外排序。如何在表中限制td排序范围？

jsfiddle

Answer 1

如果您用此替换所有javascript代码，那应该有效：

$("#sortable table tr").sortable();

请参阅小提琴：http://jsfiddle.net/sP3UZ/2231/

您必须将sortable()应用于可排序元素的容器，而不是元素本身。