jquery-ui 仅对另一个 div 中存在的单个 div 进行排序，忽略其中的所有其他 div

Question

我有这样的 div 结构：

<div id="container">
    <div id="row1" class="row">
        <div class="c1"></div>
        <div class="c2"></div>
        <div class="c3"></div>
    </div>      
    <div id="row2" class="row">
        <div class="c1"></div>
        <div class="c2"></div>
        <div class="c3"></div>
    </div>      
    <div id="row3" class="row">
        <div class="c1"></div>
        <div class="c2"></div>
        <div class="c3"></div>
    </div>      

</div>

从上面的代码中，我想要的是，我应该能够只对行进行排序。意思是，用 row2 交换 row1 ，就像那样。

我尝试了什么：

 $("#container").sortable()
 $("#container").sortable({connectWith : '.row'})
 $(".row").sortable({connectWith : '#container'})

解决方案是什么，我的每个项目都面临这个问题，你能解释一下如何准确地使用它吗？

谢谢

Answer 1

 $("#container").sortable();

工作正常。

DEMO

问题可能由以下原因引起：

• 忘记包含 jQuery
• 忘记包含 jQueryUI 库
• 不要用$(documet).ready(function() {...}) 包装脚本

Answer 2

简单尝试

 $("#container").sortable({ handle : '.row'})

Answer 3

你是说喜欢THIS吗？

如果是这样，您唯一需要的 jQuery 是：

 $("#container").sortable();