jQuery：取消最顶层 LI 元素的可排序？答案

【问题标题】：jQuery: cancel sortable on top-most LI element?jQuery：取消最顶层 LI 元素的可排序？
【发布时间】：2010-07-12 19:59:53
【问题描述】：

我有两个直接 UL 元素的可排序元素，每个元素至少有一个 LI 元素，最多有十个，排序如下：

$(".sortable").sortable({
    connectWith: ".sortable",
    cancel: '.no-drag',
}).disableSelection();

我希望每个 UL 都有一个最顶层的 LI 元素，读作“标题”。我不希望这个 LI 元素是可拖动的，也不希望它是可排序的；它实际上是 UL 的标头块。 sortable() 调用中的“取消”选项确实禁止用户拖动它，但用户仍然可以上下拖动列表中的其他 LI 元素，从而移出最顶部的 LI。我想防止这种情况发生。

本质上：我希望 LI 项目 2-N 是可排序的，并且 1 是固定的。

想法？

【问题讨论】：

标签： javascript jquery

【解决方案1】：

我认为您已经提出的解决方案没有问题，但我想我会提到使用“:not”和“:first”选择器的组合可以更直接地获得您正在寻找的期望结果：

$(".sortable").sortable({
    connectWith: ".sortable",
    cancel: '.no-drag',
    items: 'li:not(:first)'
});

或者，您可以使用“gt”选择器来指定索引大于 0 的所有列表项：

$(".sortable").sortable({
    connectWith: ".sortable",
    cancel: '.no-drag',
    items: 'li:gt(0)'
});

我相信还有很多其他方法可以解决这个问题。

【讨论】：

【解决方案2】：

嗯，一点毅力会有所帮助。只需将可排序调用更改为如下所示：

$(".sortable").sortable({
    connectWith: ".sortable",
    cancel: '.no-drag',
    items: '.sortable-item'
});

然后给每个我想要排序的 LI 一个“可排序项”类。瞧。

【讨论】：