为什么HTML5拖放拖动图像在隐藏时不显示

Why HTML5 drag and drop dragImage is not displayed when it's hidden?

本文关键字：隐藏 显示 图像 HTML5 拖放 拖动 为什么      更新时间：2023-09-26

我在HTML5拖放中将"dragImage"设置为div元素时遇到了问题。问题是，当 setDragImage（helper， x， y） 函数的 helper - 第一个参数没有出现在 dom 中或被隐藏时，当触发 'dragstart' 事件时它不可见。看看我的小提琴：http://jsfiddle.net/AemN5/10/

在小提琴中，我正在渲染助手（它被涂成黄色），比 尝试拖动绿色可拖动框，助手在鼠标上时 拖动开始。但是，请尝试单击帮助程序上方的按钮以 隐藏助手。比再次尝试拖动绿色可拖动框 - 没有帮手 连接到我的鼠标。

有什么想法为什么会发生，更重要的是如何解决问题？因为我的主要目标是拥有不可见的助手，并且只有在用户开始拖动时才能使其可见附加到光标。

这是一个可能的解决方案 http://jsfiddle.net/AemN5/12/

尝试这样做。
Chrome 要求至少在开始拖动之前显示图像。

$("[draggable]").on("dragstart", function(e) {
    $("#img1").show();
    e.originalEvent.dataTransfer.setDragImage(helper, 50, 50);
    setTimeout(function(){
        $("#img1").hide();
    },0);
});
相关文章：