如何使用jQuery UI sortable（）将元素拖入下拉列表？
简短版本 ：如何将Link 1拖动到此演示中Link 3下的其中一个下拉菜单中？ http://jsfiddle.net/Gdadu/2/
编辑 ：关于项目被拖动到另一个项目时应该发生什么的问题已经提出：它应该放在左/右还是开始一个新的子菜单？ 为了使列表完全可排序，必须有一些方法将项目放入不存在的子菜单，开始新的ul下拉列表。 我可以在每个没有一个尚未用作放置目标的列表项中插入空ul ，但上面的问题仍然存在。
这似乎比我最初的想法困难得多，所以我为没有付出更多努力而道歉，因为我没有考虑过这些问题。 我愿意接受对所述问题的回答，并担心其余的问题。
我有一个基本的下拉导航列表，我希望使用jQuery UI完全排序。 任何li元素都应该能够移动到整个列表中的任何位置。 我将顶级列表项拖到子菜单时遇到问题，似乎:hover在“拖动模式”下， :hover不会在下拉列表中触发，因此下拉列表不会出现。
示例HTML：
我的CSS：
.dropdown, .dropdown li, .dropdown ul { list-style:none; margin:0; padding:0; } .dropdown { position:relative; display:block; z-index:10000; } .dropdown ul { position:absolute; top:100%; width:100%; visibility:hidden; display:none; z-index:900; } .dropdown ul ul { top:0; left:100%; } .dropdown li { position:relative; float:left; } .dropdown li:hover{ z-index:910; cursor:default; } .dropdown ul:hover, .dropdown li:hover > ul, .dropdown a:hover + ul, .dropdown a:focus + ul { visibility:visible; display:block; } .dropdown a { text-decoration:none; display:block; padding:.5em 2em; background:#cde; border:1px solid #ccc; } .dropdown ul li { width:100%; }
可排序初始化：
$('.dropdown').sortable({ items: 'li' });
演示： http ： //jsfiddle.net/Gdadu/2/
例如，我想将“链接1”拖动到子菜单中，但不能这样做，因为拖动时子菜单不会出现，就好像:hover忽略:hover 。 我不确定问题出在CSS或javascript中。 我该怎么办？
评论中的好主意：
也许你可以在拖动开始时触发所有内容扩展
这可能会有效，但我不希望整个菜单扩展。 它可能是很多内容，包含许多链接和3级导航，并且可能与所有弹出/下拉（巨大的混乱）重叠。
这是一个小提琴，显示了一些可以帮助您实现的要点： http ： //jsfiddle.net/Gdadu/13/
它远非完美，正如评论中指出的那样，“将所有内容排序到处”也存在一些逻辑问题:)这里没有工作的东西是将嵌套的li排序回顶级，在嵌套的ul上排序，…但我认为它们在那里勾勒出来。 区分排序和拖动可能是jqueryui当前状态的必要条件。 此外，我为子菜单快捷方便你的优秀css解决方案，并使它们基于javascript，以简化一些事情。
但是：您可以在link3或link3的嵌套ul中删除link1;）