Javascript jQuery UI可排序和可拖动问题

我有一个嵌套的排序表，它本身运行得不太好，但我也添加了一个Draggable，这会导致更多的问题

• 在嵌套的排序表之间排序项目几乎是不可能的，请尝试；）
• 将DragTable拖动到内部排序表中也会将新项添加到外部排序表中

例如：

我想这在当前版本的jQueryUI中是不可能实现的

---

编辑：

项目1
项目2
项目3

第4项


$（'ul'）.bind（'mouseenter'，function（）{
//$（this）.parents（'ul'）.sortable（'destroy'）；//此行是可选的…：）
$（this.sortable（{'items'：'li'）；
});
$（'ul'）.bind（'mouseleave'，function（）{
$（this.sortable（'destroy'）；
});

这可能不起作用，因为我还没有测试过它，但你确实得到了我希望的想法：）

项目1
项目2
项目3

第4项


$（'ul'）.bind（'mouseenter'，function（）{
//$（this）.parents（'ul'）.sortable（'destroy'）；//此行是可选的…：）
$（this.sortable（{'items'：'li'）；
});
$（'ul'）.bind（'mouseleave'，function（）{
$（this.sortable（'destroy'）；
});

---

这可能不起作用，因为我没有测试它，但你确实得到了我希望的想法：）

在Windows 7上的Chrome 12中似乎对我很好。因为我有11个，所以无法测试Chrome 12，但在Firefox 4、Opera 11和Internet Explorer 9中似乎也失败了，在Windows 7上测试。这不是不可能的，我已经完成了，但需要一点努力。。。等等…它不会“失败”对于Firefox 4.0.1中的我来说，虽然我同意您的第一点，但将容器2中的项目1移动到容器2的末尾会产生一种奇怪的效果，并且将项目的放置点固定在该项目上是一件麻烦事。我已设法解决了第二个问题，只需将一个可排序实例添加到外部容器中，并将“项目”选择器从“>。项目”至“.item”。它仍然有点神经质，但这可能与样式有关，因为我不是一个很好的设计师，我会搜索修复程序并相应地更新我的帖子。示例：在Windows 7上的Chrome 12中，我似乎可以正常工作。因为我有11个，所以无法测试Chrome 12，但在Firefox 4、Opera 11和Internet Explorer 9中，在Windows 7上测试似乎也失败了。这不是不可能的，我已经完成了，但付出了一点努力。。。等等…它不会“失败”对于Firefox 4.0.1中的我来说，虽然我同意您的第一点，但将容器2中的项目1移动到容器2的末尾会产生一种奇怪的效果，并且将项目的放置点固定在该项目上是一件麻烦事。我已设法解决了第二个问题，只需将一个可排序实例添加到外部容器中，并将“项目”选择器从“>。项目”至“.item”。它仍然有点神经质，但这可能与样式有关，因为我不是一个很好的设计师，我会搜索修复程序并相应地更新我的帖子。示例：这使得将项目从外部可排序表拖动到内部可排序表的跳跃性降低，但它破坏了将项目从内部可排序表移动到外部可排序表的能力，也破坏了将新项目从可排序表拖动到可排序表的能力，但感谢您尝试帮助我解决一个提示，即您应该使用ul、li组合，因为它更易于管理，并且可排序处理得更好：）对div元素进行排序应该不会有任何问题，因为如果添加“display:list item；”，它的行为就像列表项一样。我不能使用ul>li组合，因为我需要一个更复杂的容器，其中并非所有项目都有相同的父项，如果你知道我的意思的话。@melvin哦，是的，我知道你的意思，那么你应该使用拖放功能，其中droppable有一个

接受

，以便可以在你想要的地方拖放：）然后

序列化

，最后是sortable，然后无需销毁sortable，因此您可以通过ajax保存列表：）这使得将项目从外部可排序表拖动到内部可排序表更轻松，但它破坏了将项目从内部可排序表移动到外部可排序表的能力，也破坏了将新项目从可拖动到可排序表的能力，但感谢您尝试帮助我说出一个技巧，就是您应该使用ul、li组合，因为它更易于管理，并且sortable处理它们更好：）排序div元素应该不会有任何问题，因为如果您添加“display:list item；”，它的行为就像列表项一样。我不能使用ul>li组合，因为我需要一个更复杂的容器，其中并非所有项目都有相同的父项，如果你知道我的意思的话。@melvin哦，是的，我知道你的意思，那么你应该使用拖放功能，其中droppable有一个

接受

，以便可以在你想要的地方拖放：）然后

序列化

，最后是sortable，然后无条件地销毁sortable，因此您可以通过ajax保存列表：）

<ul>
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>
       <ul> <li>Item 4</li> </ul>
   </li>
</ul>

$('ul').bind('mouseenter',function (){
   //$(this).parents('ul').sortable('destroy');//this line is optional... :)
   $(this).sortable({'items':'li'});
});
$('ul').bind('mouseleave',function (){
   $(this).sortable('destroy');
});