jquery-ui - JQuery拖放插件的延迟初始化

Question

是否可以延迟 jQuery UI 拖放插件的初始化，直到进行移动或单击？不确定这是否可能。我有大量使用拖放的单元格，比如 Excel 网格，性能不是很好。

Answer 1

您可以使用delay或distance。

$( ".selector" ).draggable({ delay: 300 });

$( ".selector" ).draggable({ distance: 10 });

从 API 文档：

鼠标按下后的延迟
时间（以毫秒为单位），直到开始拖动。此选项可用于防止单击元素时出现不必要的拖动。

距离
鼠标按下后鼠标必须在开始拖动之前移动的距离（以像素为单位）。此选项可用于防止单击元素时出现不必要的拖动。

---

更新：

要保持更标准的功能并仅在需要时初始化可拖动，请尝试使用悬停功能，如下所示：

工作示例

$('div').hover(function () {
    $(this).addClass('selector');
    $(".selector").draggable({
        //options
    });
},

function () {
    $('div').removeClass('selector');
});

Answer 2

我走了这条路，它似乎奏效了。

$.fn.liveDraggable = function (opts) {
    this.one("mouseover", function () {
        if (!$(this).data("init")) {
            $(this).data("init", true).draggable(opts);
        }
    });
    return this;
};