jquery可排序项目问题答案

【问题标题】：jquery sortable items questionjquery可排序项目问题
【发布时间】：2009-12-11 21:42:16
【问题描述】：

给定以下结构，包含可排序列表的 div 是否可以排序？我问是因为使用最新的 jquery 1.3 版本，它不允许对 div 进行排序。 jQuery 是否有任何限制，它无法对包含已排序列表的父元素进行排序，或者是因为父元素是 div 而不是 LI 元素？有什么想法吗？

<div class="row">
<ul class="sortable">
<li>test1</li>
<li>test2</li>
</ul>
</div>
<div class="row">
<ul class="sortable">
<li>test1</li>
<li>test2</li>
</ul>
</div>
<div class="row">
<ul class="sortable">
<li>test1</li>
<li>test2</li>
</ul>
</div>

【问题讨论】：

请澄清你所有的版本号...我想你有一个错字。最新的 jq 是 1.3.x，UI 是 1.7... 是您的版本# 用于不同的 sortabel 插件或来自 UI 的插件以及 UI 和 JQ 的哪个版本。
感谢您注意到这一点。更正。我使用随 UI 下载的可排序插件。
您使用什么代码来尝试对它们进行排序？ $('div.row').sortable()?
是的，我已经用 1.3 完成了嵌套排序

标签： jquery jquery-ui jquery-ui-sortable

【解决方案1】：

估计有误会

这个命令

$('div.row').sortable()

实际上会使您的 div 中的 uls 可排序。这没有意义，因为每个 div 中只有一个 ul 并且对单个元素进行排序没有意义。（演示页面：http://jsbin.com/ayiwu）

如果您想对divs（不是uls 或lis）进行排序，您可以使用这一行

$("div.row").wrapAll("<div></div>").eq(0).parent().sortable();

现在div 本身是可排序的（演示页面：http://jsbin.com/upixa

如果您希望 divs 和 **li**s（不是 uls，当每个 div 只有一个 ul 时没有意义）可排序同时

$("div.row").wrapAll("<div></div>").eq(0).parent().sortable();
$("div.row").sortable({ items: "li" });

演示页面：http://jsbin.com/ujatu

如果你想要别的东西，请发表评论

P.S.：对于演示页面上可怕的 CSS 感到抱歉。只是为了清楚起见，您可以看到您单击的是哪个元素

【讨论】：