我创建了一个 contentEditable div 用作富文本区域。它周围有我想摆脱的调整大小处理程序。知道我该怎么做吗？
编辑：这似乎正在发生，因为我绝对定位了 div，因此 Firefox 向我无法关闭的元素添加了一个令人愤怒的 _moz_resize 属性。
【问题讨论】：
标签： html richtextbox contenteditable designmode richtextediting
您是否尝试过添加样式
border: none;
到 div？
【讨论】：
看起来我可以通过添加包装器 div 并绝对定位包装器然后使内部 div 内容可编辑来解决此问题。
【讨论】：
顺便说一句，您可以通过向文档发送（文档记录不佳的）enableObjectResizing 命令来禁用 Firefox 的自动调整大小句柄功能：
document.execCommand("enableObjectResizing", false, false);
AFAIK，只有在文档加载后才能安全地完成此操作，而且我无法禁用抓取器，这是一个单独的功能。
【讨论】：
在 Chrome 39 中，这些句柄似乎不存在，即使您希望它们存在。
在 Firefox 中，可以简单地使用 execCommand，就像 ZoogieZork 回答的那样。
但在 Internet Explorer 中，此功能无法关闭。必须解决它。
在WYMeditor 开发中，这是我发现的。
以下结果：
mouseup 上选择的文本
mouseup 将导致选择图像。这是我在深呼吸数小时后能想到的最好的方法。如果你真的想摆脱那些句柄，我认为这已经足够了。
在 IE 中，将 oncontrolselect 设置为在图像上返回 false，确实可以防止出现这些句柄，您可以巧妙地做到这一点，将以下处理程序附加到 mousedown 事件：
function (evt) {
var img;
function returnFalse() {
return false;
}
if (evt.tagName.toLowerCase() === "img") {
img = evt.target;
img.oncontrolselect = returnFalse;
}
}
它实际上并不能完全正常工作。效果不好的原因是为了开始对图像进行拖放操作，必须按住鼠标不移动它，一瞬间，然后才开始移动它。阻力。如果按下鼠标并立即开始拖动，图像将保持在原位而不被拖动。
所以我没有这样做。
我所做的是以下。在所有浏览器中，我使用mouseup 来专门选择目标图像。在非IE和IE11中，同步：
function (evt) {
if (evt.target.tagName.toLowerCase() === "img") {
selectSingleNode(img); // In my case, I used Rangy
}
}
在 IE 7 到 10 中，异步：
function (evt) {
if (evt.target.tagName.toLowerCase() !== "img") {
return;
}
window.setTimeout(function () {
selectSingleNode(img); // In my case, I used Rangy
}, 0);
}
这确保了这些句柄出现后，它们会尽快消失，因为图像失去了“控制选择”，因为该选择被常规文本选择所取代。
在 Internet Explorer 7 到 11 中，我将一个处理程序附加到 dragend 以删除所有选择：
function (evt) {
if (evt.target.tagName.toLowerCase() === "img") {
deselect(); // I use Rangy for this, as well
}
}
这会使拖放后显示的手柄消失。
我希望这会有所帮助，我希望你能做得更好。
【讨论】：
对于 IE11（我没有测试过旧版本的 IE，但我觉得它可以工作）你可以在 img 标签中添加 contenteditable="false" 属性。这将防止在保持拖放到位的同时进行任何重新调整大小。
【讨论】：
...有史以来最好的修复
<div contenteditable="true">
<label contenteditable="false"><input/></label>
</div>
或任何包装你的输入/img的html元素
像魅力一样在 IE11 上运行
【讨论】：
contenteditable时看到IE11中的resize句柄
我只是面临这个问题。
我试过document.execCommand("enableObjectResizing", false, false);，但是移动图标仍然出现。当onmousedown 事件发生时，刚刚解决我的问题的只是e.preventDefault()。
element.onmousedown = function(e){
e.preventDefault();
}
【讨论】：