javascript - 在 contenteditable 中禁用 IE 8-11 中的 (img) 调整大小句柄，并尽可能删除它们

Question

这个问题可能已经被问过好几次了，但是我仍然无法解决问题。我正在构建自己的 WYSIWYG，其中一个选项是将图像插入 contenteditable 元素 (div)。在 IE (8-11) 中，调整大小的句柄被附加到单击的图像上。我想删除那些句柄并完全禁用在 IE 中调整大小。还能够在 IE 8-10 中的 contenteditable 元素中注册图像的点击事件。

到目前为止我尝试了什么

将父元素的 onresizestart 属性(所见即所得)设置为 function(){return false;}

document.getElementById('wysiwyg').onresizestart = function(){return false;}

上面的代码在 IE 8-10 中工作，它禁用图像大小调整，但它在 IE 11 中失败。

我还尝试将图像的 oncontrolselect 属性设置为

image.oncontrolselect = function(){return false;}

这将禁用调整大小并且不显示 handle ，但用户无法将图像拖放到 contenteditable 区域内。

在 Firefox 中(其他(Webkit)浏览器没有实现这样的东西)这是通过

document.execCommand("enableObjectResizing", false, false);

那么，我怎样才能在 IE 8-11 中禁用/删除这些句柄，并且还能够在 contenteditable 中的图像上注册点击事件？

Answer 1

将 unselectable 属性设置为 on 到您的图像:

img = document.getElementById('/*image id*/");

img.setAttribute('unselectable','on');