image - Firefox - designMode：禁用图像大小调整句柄

Question

如何防止用户在 designMode 中调整图像大小？（单击图像时禁用手柄）

score 16 · Accepted Answer

这适用于 Firefox：

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

对于 IE，我使用过：

image.attachEvent("onresizestart", function(e) { e.returnValue = false; }, false);

score 10 · Accepted Answer

假设您像这样打开 contentEditable ：

document.body.contentEditable = true;

您所要做的就是为所有（或部分）图像关闭它。

var imgs = document.getElementsByTagName("IMG");
for (var i = 0; i < imgs.length; ++i) {
    imgs[i].contentEditable = false;
}

score 5 · Accepted Answer

我想你会发现这更容易接受。似乎可以在 Firefox 中使用，但我不确定其他浏览器：

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

它使拖放功能保持不变。

score 1 · Accepted Answer

好吧，你不能在 Firefox 和 IE 中删除那些调整大小的处理程序……至少我找不到解决方案。

最后，我通过编辑 FF 安装文件夹中的一些配置文件在 Firefox 中进行了管理，我们不想这样做，对吧？

无论如何，如果您想禁用调整图像大小（但调整大小处理程序仍然可见），只需添加一些 css 样式，例如：

img {
    width: auto !important;
    height: auto !important;
}

问候，米海洛

score 1 · Accepted Answer

虽然这个问题是很久以前的问题了。每个块元素（div、img...）都将使用 FF 的句柄进行装饰。测试它：

<div id="myDiv" contenteditable="true"><p>Sample text!</p></div>

没有句柄，没有调整大小等。

<div id="myDiv" contenteditable="true"><p>Sample text!</p><img src="picture.jpg" /></div>

图像可以调整大小。因此，您必须为您不想拥有句柄的每个块元素显式调用 contenteditable="false"，正如 nickf 已经对图像所说的那样。

更奇怪的是：将“位置：绝对”分配给您的任何元素 - 甚至是父 div - 它再次具有句柄。

score 0 · Accepted Answer

我还不能评论和投票，所以......根据nmb.ten的回答，你必须使用：

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

但它仅在您填写内容后才有效（我的意思是如果您必须编辑之前保存的一些文本）。

6 回答 6