Question

我有一个'ul'元素，最后一个'li'是创建新元素。由于jqueryui sortable（），ul是可排序的，并且我从$（'ul'）排除了最后一个'li'元素.sortable（），以便元素不可拖动。但是，列表中的其他项可以放在最后一个li元素下。我想阻止这个。有没有办法限制物品的丢弃位置？

简单概念HTML：

<ul>
    <li class="list-element">potato</li>
    <li class="list-element">tomato</li>
    <li class="list-element">banana</li>
    <li class="list-element">pistacchio</li>
    <li class="new-element">new product</li>
</ul>

和.js：

$('ul').sortable();
$("ul").disableSelection();
$('ul').sortable({ cancel: '.new-element' });

小提琴：http://jsfiddle.net/s4yjpoaL/

如您所见，可以在.new-element li下拖动所有项目。有没有办法将可拖动性限制在最后一个li元素之前？

PS：我知道将最后一个元素放在ul之外会更容易，但这不是重点：P

Answer 1

通过将排序的items指定为其他li项来执行此操作。

http://jsfiddle.net/s4yjpoaL/2/

$('ul').sortable({
    items: ".list-element",
    cancel: ".new-element",
});

除了使其无法移动外，还会禁用最后一个元素的放置区。

限制可以删除jqueryui可排序项的区域

1 个答案: