如何禁用在contenteditable div中拖动文本？

Question

我目前正在研究内容可编辑的div。目前，它具有此默认行为，允许您在其中拖动文本。

Chrome / Windows（到目前为止，我测试过的唯一环境）。

如何禁用它？为以下测试做了一个简单的代码段：

#root {
  border: 1px solid silver;
  white-space: pre-wrap;
}

<p>Try selecting a piece of test and drag it around the editable area</p>
<div id="root" contenteditable>Hello World
This is a contenteditable
DIV!
</div>

Answer 1

如果您使用的是jquery。试试这个。

$('#root').bind('dragover drop', function(event){
  event.preventDefault();
  return false;
});

Answer 2

您可以使用html属性draggable =“ false”。

<div draggable="false">123456</div>