在DIV上拖放文本

Question

我的网站上有一个div，当点击它时，会显示搜索框（使用jQuery完成）。

但是，我希望这个div能够接受拖拽的文字。在我的用例中，用户从网站上的任何位置选择常规文本，然后拖放它以将其复制粘贴到搜索框中。

如果搜索框始终可见，他可以直接将其放入文本框中，由浏览器/操作系统本地处理。但是，有没有办法用这个div模拟同样的东西？用户将他的文本放到div上，它会触发click事件以显示文本框并将删除的文本粘贴到框中。

我的网站使用Modernizr + jQuery + jQuery UI和HTML5 / CSS3。 IE6兼容性不是问题。

提前谢谢！

Answer 1

您可以使用HTML5拖放事件：

$('#dropTextHere').bind('drop', function (e) {
    var theDroppedText = e.originalEvent.dataTransfer.getData('Text');
});

您可以详细了解here。