Question

所以我有超过9000个元素，每个元素都应该被拖动。通过直接应用jQueryUI插件将它们变为可拖动似乎是不可行的。我正在考虑通过监听文档的鼠标按下事件并检查事件的目标是否是其中一个元素，使元素可以响应鼠标按下事件。一旦将鼠标放在元素上，我将其转换为可拖动的和，同时使其被捕获并拖动，以便继续拖动，就好像鼠标向下启动了拖动一样。拖动完成后（通过删除或取消），可拖动的插入被破坏，元素返回到未绑定状态。这样，一次只能拖动一个元素，使这个解决方案变得轻量级和可扩展。

我该怎么做？

Answer 1

可以使用trigger()和draggable("destroy")：

的组合来完成此操作

function downHandler(event)
{
    var target = $(event.target);
    target.off("mousedown", downHandler); // prevents infinite recursion
    target.on("mouseup", upHandler);
    target.draggable();
    target.trigger(event);
}

function upHandler(event)
{
    var target = $(event.target);
    target.draggable("destroy");
    target.off("mouseup", upHandler);
    target.on("mousedown", downHandler);
}

$(".draggable-on-mousedown").on("mousedown", downHandler);

演示：http://jsfiddle.net/jPjKN/

按需拖放：如何在单个mousedown事件中启用，启动和继续拖动所有内容？

1 个答案: