Question

我有以下空列表：

<ul class="sortable_list">
  <p><a>Add new item</a></p>
</ul>
<ul class="sortable_list">
  <li class="sortable_item">
    AAA
  </li>
  <li class="sortable_item">
    BBB
  </li>
  <p><a>Add new item</a></p>
</ul>

以下脚本：

$(".sortable_list").sortable({
  items: "li.sortable_item",
  connectWith: ".sortable_list",
  axis: "y",
  cursor: "move",
  placeholder: "ui-state-highlight",
  revert: "140",
    update: function() {
        alert('hehe');
    }
}).disableSelection();

第一个ul.sortable_list为空。当我将li.sortable_item从第二个ul.sortable_list拖到第一个ul.sortable_list时，li项可以放在p下面，这不是我想要的。我希望它始终高于p。

但是，如果我拖放同一列表中的第二个ul.sortable_list项，则它不能低于p，这正是我想要的。

我该如何解决这个问题？

感谢。

Answer 1

我必须遵守.sortable()的约定。

将标记更改为：

<ul class="sortable_list">

</ul>
<p><a>Add new item</a></p>

<ul class="sortable_list">
  <li class="sortable_item">
    AAA
  </li>
  <li class="sortable_item">
    BBB
  </li>
</ul>
<p><a>Add new item</a></p>

jQuery UI可排序拖放到空列表

1 个答案: