可以从浏览器拖动的隐藏文字？

Question

如何创建一个html元素,当从浏览器拖动到文本编辑器时,拖动元素上或中的隐藏文本将被粘贴到编辑器中？

我的第一个想法是在锚标记上使用href属性:

<a href="hidden message text here">Drag me into a text editor!</a>

这在chrome中非常有用,但是firefox和safari会从href值中删除空格,这会使复制的消息无法使用.

有任何想法吗？

Answer 1

您不想操纵浏览器拖动文本/链接/图像的默认行为，而是希望将数据设置为事件中的任意内容dragstart。

例如，使用隐藏中的文本#content：

$('[draggable]').on('dragstart', function(e) {
    var content = $(this).find('#content').text(); // Can be anything you want!
    e.originalEvent.dataTransfer.setData('text/plain', content);
    $(this).addClass('dragging');
});

这是一个正在运行的JSFiddle