Javascript 使元件在长压过程中立即可拖动？

我有以下代码，可以在长按后拖动元素：

$(document).on('touchstart mousedown','.menu-item', function () {
    console.log('mousedown');
    var self = this;
    t = setTimeout(function () {
        $(self).addClass('draggable');
        console.log('draggable');
        $(self).draggable();
    }, 800);
});

从技术上讲，这是可行的，但你必须放松鼠标，然后点击拖动。我希望这是无缝的。我尝试在加载DOM时将它们都设置为可拖动，然后禁用它们（

.draggable（'disable'）

），然后在长按时重新启用，但这也不起作用

这是一把小提琴，它展示了我的意思：

---

如何执行此操作？

您可以在添加拖动表后触发元素上的原始事件：

$(self).draggable().addClass('draggable');
$(self).trigger(event)

以下是一个工作示例：

vart；
$（文档）.on（'mousedown'，'）。菜单项'，函数（事件）{
var self=这个；
if（$（self）.hasClass（'draggable'））{
返回；
}
t=设置超时（函数（）{
$（self）.draggable（）.draggable（'enable'）.addClass（'draggable'）；
log（'start drag'）；
$（自）.触发器（事件）
}, 800);
});
$（document）.on（“mouseup”，函数（）{
清除超时（t）；
$（'.draggable'）.removeClass（'draggable'）.draggable（'disable'））
});
$（函数（）{
$（'#container'）。追加（'1'）
$（“#容器”）.append（'2'）
$（“#容器”）.append（'3'）
$（“#容器”）.append（'4'）
$（'#container'）。追加（'5'））
});
正文{
背景：浅灰色；
}
.菜单项{
显示：内联块；
宽度：40px；高度：40px；
背景色：白色；
保证金：5px；
文本对齐：居中；
线高：40px；
光标：指针；
用户选择：无；
变换：比例（1）；
}
.拖拉{
背景颜色：黄色；
转换：比例（1.2）；
}
#日志{
}
添加可拖动对象后，可以触发元素上的原始事件：

$(self).draggable().addClass('draggable');
$(self).trigger(event)

以下是一个工作示例：


vart；
$（文档）.on（'mousedown'，'）。菜单项'，函数（事件）{
var self=这个；
if（$（self）.hasClass（'draggable'））{
返回；
}
t=设置超时（函数（）{
$（self）.draggable（）.draggable（'enable'）.addClass（'draggable'）；
log（'start drag'）；
$（自）.触发器（事件）
}, 800);
});
$（document）.on（“mouseup”，函数（）{
清除超时（t）；
$（'.draggable'）.removeClass（'draggable'）.draggable（'disable'））
});
$（函数（）{
$（'#container'）。追加（'1'）
$（“#容器”）.append（'2'）
$（“#容器”）.append（'3'）
$（“#容器”）.append（'4'）
$（'#container'）。追加（'5'））
});
正文{
背景：浅灰色；
}
.菜单项{
显示：内联块；
宽度：40px；高度：40px；
背景色：白色；
保证金：5px；
文本对齐：居中；
线高：40px；
光标：指针；
用户选择：无；
变换：比例（1）；
}
.拖拉{
背景颜色：黄色；
转换：比例（1.2）；
}
#日志{
}

这会导致无休止的循环。我怎样才能避免呢？什么无休止的循环？我对代码没有任何问题。。。你能解释一下吗？我想这是因为
trigger（event）
再次触发mousedown事件，这会启动一个新的计时器，触发事件，等等。。不？你说得对：）我错过了。代码已修复，您现在可以检查。越来越近，唯一剩下的问题是鼠标上的I get错误：无法在初始化之前调用draggable上的方法；试图调用方法“disable”
。我试着切换
.removeClass（）
和
.draggable（'disable'）
，但没有效果。但可能需要一个不同的问题？这会导致一个无休止的循环。我怎样才能避免呢？什么无休止的循环？我对代码没有任何问题。。。你能解释一下吗？我想这是因为
trigger（event）
再次触发mousedown事件，这会启动一个新的计时器，触发事件，等等。。不？你说得对：）我错过了。代码已修复，您现在可以检查。越来越近，唯一剩下的问题是鼠标上的I get错误：无法在初始化之前调用draggable上的方法；试图调用方法“disable”

。我试着切换

.removeClass（）

和

.draggable（'disable'）

，但没有效果。但可能需要一个不同的问题？