2

我们的页面中有一个嵌套菜单，可以在其中拖放以重新排序和嵌套菜单项。

似乎存在一个问题（我们使用的是 jQuery 1.7.2 和 UI 1.8.22），如果您同时具有可排序和可放置，则排序容差不一致并导致问题。

一个例子会比我更好地解释它......

http://jsfiddle.net/8fUxV/5/

我刚刚创建了显示问题所需的最低限度，而不是嵌套菜单，只是我们用来使其工作的机制。

拿起“项目 4”并非常缓慢地将其向上拖动。3 将突出显示，表示这是放置的目标。好的，但是继续向上移动，直到它位于 2 和 3 之间的间隙中。我想把它放在这里并进行排序。但是如果我这样做了，因为 3 仍然突出显示，它将改为“丢弃”（在我们的真实代码中，创建一个嵌套菜单）。

实际上，在第 2 项之前有几个像素，您可以在其中获得所需的效果。但是，如果您向下移动太远，它将再次下降而不是排序。

从本质上讲，问题是我会认为如果该项目处于间隙中，它应该排序并且只有当我超过另一个突出显示的项目时才会下降。

我有一个部分解决方法，它强制 UI 重新计算位置 - 取消注释“out”函数中的代码。

现在，如果您向上拖动 4 仍然会遇到同样的问题，但如果您触摸 2 并向下移动到间隙中，则不会突出显示任何内容，因此它将正确排序。

但问题仍然是，第一次向上拖动并不像您在第一次重新排列时所期望的那样起作用。

（我确实尝试将解决方法添加到 jquery.ui 代码中 ui.sortable 的 _mousedrag 中，它确实解决了问题......但我不知道我在那里做什么:)

所以我不确定我做错了什么还是这是一个错误？

在我记录错误报告之前，有没有人遇到过类似的事情？

4

1 回答 1

3

在挖掘源代码后，我找到了一个解决问题的选项。

问题是当一个项目被移动并且虚拟占位符被插入到列表中时，位置计算不正确。

您需要将此添加到您的可排序中，

refreshPositions: true

例如

$("ul").sortable({
    helper: "original",
    refreshPositions: true,
    update: function(event, ui) {
       :
    }
});

这会导致它重新计算每次鼠标移动的位置。效率极低，但否则将无法正常工作。

于 2012-08-08T19:52:55.970 回答