限制jQuery Sortable中的嵌套容器

Question

我正在使用该jquery可排序脚本（ http://johnny.github.io/jquery-sortable/ ）的UI上工作。 我想要一个嵌套列表，在其中只能将特定项目拖入其中。 这是一个例子：

这是嵌套列表。 我要阻止的是，我可以拖动

第二

第三

进入嵌套列表。

$("ol.example").sortable({
    isValidTarget: function($item, container){
    // Here should be some kind to restrict the nested list
    }
});

我可以初始化sortable-list并使用isValidTarget：Option配置可能的操作

 $("ol.example").sortable({ isValidTarget: function($item, container){ // Here should be some kind to restrict the nested list } }); 

我无法使其正常工作，因为我不知道如何询问目标是否为嵌套列表。 有人有主意吗？ 也许这是一个简单的问题，但是我对JavaScript还是很陌生。

最好的祝福

Answer 1

容器具有target元素作为属性（ container.el ），其中包含当前目标容器的jQuery元素。 您可以在上面使用jQuery方法来确定它是否是有效的目标。 我认为以下是您要尝试执行的操作。

 $("ol.example").sortable({ isValidTarget: function($item, container) { if (container.el.hasClass("nested1")) { return false; } else { return true; } } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://johnny.github.io/jquery-sortable/js/jquery-sortable-min.js"></script> <ol class="example"> <li>First <ol class="nested1"> <li>N1</li> <li>N2</li> <li>N2</li> </ol> </li> <li>Second</li> <li>Third</li> </ol>