Question

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

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

第二次

第三次

进入嵌套列表。

<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>

我可以初始化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方法来确定它是否是有效目标。我认为以下是您正在尝试做的事情。

＆＃13;

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

＆＃13;

<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>

＆＃13;

在jQuery Sortable中限制嵌套容器

1 个答案: