ContentEditable DIV - 禁用拖放 [英] ContentEditable DIV - disabling drag and drop
问题描述
是否可以在contentEditable属性设置为true的元素上禁用拖放功能。
Is it possible to disable the drag-and-drop functionality on elements which have the contentEditable attribute set to true.
我有以下HTML页面。
I have the following HTML page.
<!DOCTYPE html>
<html><meta charset="utf-8"><head><title>ContentEditable</title></head>
<body>
<div contenteditable="true">This is editable content</div>
<span>This is not editable content</span>
<img src="bookmark.png" title="Click to do foo" onclick= "foo()">
</span>
</body>
</html>
我面临的主要问题是可以将图像拖放到DIV中它被复制（连同标题和点击处理程序）
The main problem I'm facing is that it is possible to drag and drop the image into the DIV and it gets copied (along with the title and the click handler)
推荐答案
以下代码段将阻止你的div接收拖动的内容：
The following snippet will prevent your div from receiving dragged content:
jQuery('div').bind('dragover drop', function(event){
event.preventDefault();
return false;
});
I（以及其他几个人）发现这个api很奇怪且反直觉，但它确实阻止了在IE8（包括IE9 beta）之外的所有浏览器中接收拖动内容。到目前为止，我无法阻止IE8接受contenteditable。
I (and several others) find this api to be strange and counter-intuitive, but it does prevent a contenteditable from receiving dragged content in all browsers except IE8 (including IE9 beta). As of yet, I cannot prevent IE8 from accepting contenteditable.
如果我找到了办法，我会更新这个答案。
I'll update this answer if I find a way to do so.
这篇关于ContentEditable DIV - 禁用拖放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
