javascript - 为什么可拖动对象的占位符缓慢？

我确实没有问题，但是，我注意到有时Draggable对象的占位符很慢。

我做了这个测试:http://jsfiddle.net/X3Vmc/

    $(function () {
        $("#myproducts li").draggable({
            /*appendTo: "body",*/
            helper: "clone",
            connectToSortable: "#mylist",
            tolerance: "pointer"
        });
        $("#mylist").sortable({
            placeholder: "sortable-placeholder",

            over: function () {
                console.log("over");

            },
            out: function () {
                console.log("out");
            }
        });
    });

将列表对象添加到可拖动对象很容易而没有问题，但是当我尝试在可拖动对象中移动元素时，我看到红色占位符移动缓慢。

我的意思是，有时某个元素水平移动时，占位符会留出更多时间移动(以更新其位置)。我必须在新位置周围移动鼠标以更新占位符的位置。我想让它更具 react 性。这可能吗？

编辑:

看一下图像。如您所见，我正在第一个位置和第二个位置之间移动元素(从第四位置)。如您所见，占位符离那里很远。

编辑2:

我正在使用* Chromium 30.0.1599.114 Ubuntu 13.10(30.0.1599.114-0ubuntu0.13.10.2)*

最佳答案

您的权利是，如果您在Sortable对象内添加一个空的<li></li>，则可以解决此问题。

我认为这是一个可行的解决方案，无论出于何种原因，在初始化可排序对象时，可排序对象仅需要其中的可排序项。我相信答案的核心是这样:The sortable needs to know what kind of elements it is going to be sorting when initialized in order for the placeholder to work properly. Therefore if you are going to be sorting li elements, you should initialize the sorter with at least 1 li element in the Sortable object.
我相信是这种情况，因为我尝试用和替换空的<li>和空的<div>，但并没有解决问题。

您的解决方案目前只有两个小问题。拖动可拖动对象时，仍会使用空<li>。您会看到，可拖动对象可以在empty li的左侧和右侧进行排序，这看上去有点好笑。您也可以拖动empty li，这可能会引起一些困惑。

但是幸运的是，解决方法非常简单。 li在初始化时只需要处于可排序状态即可。之后我们可以将其删除，一切正常!

HTML-可通过li元素进行排序。

<ul id="mylist">
    <li></li>
</ul>

jQuery的

$(function () {
    $("#myproducts li").draggable({
        /*appendTo: "body",*/
        helper: "clone",
        connectToSortable: "#mylist",
        tolerance: "pointer"
    });
    $("#mylist").sortable({
        placeholder: "sortable-placeholder"

    });
    $("#mylist").empty();  //remove the empty li - only needed for initialization
});

FIDDLE

关于javascript - 为什么可拖动对象的占位符缓慢？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20182121/