Question

如何在IE 7 +的可疑模式中有选择地关闭图像大小调整手柄？我已经尝试将图像的contentEditable设置为false，并将其onresizestart设置为“return false”无效。

我正在使用tinyMCE。

Answer 1

为您的图片设置unselectable="on"。适用于较旧的IE，但最近已被弃用。

Answer 2

我在tinyMCE中使用advimagescale插件来阻止调整所有图像的大小。但是，我发现它阻止了图像被拖放到编辑器实例中。

我发现我可以使用以下方法去掉mouseup上的size属性：

setup : function(ed) {
    ed.onMouseUp.add(function(ed, e) {
        if (e.target.nodeName == "IMG") {
            e.target.removeAttribute("width"); 
            e.target.removeAttribute("height"); 
        }
    });
}

我非常喜欢摆脱那些该死的手柄。

Answer 3

这需要痛苦，时间和运气才能找到：您希望'controlselect'事件删除IE中的调整大小句柄。

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

上面的代码对我有用（警告：不使用TinyMCE，但是，这似乎是一个内容可编辑的头痛，而不是特定的TinyMCE）。你需要在你想要没有这些拖动句柄的任何元素上设置这个处理程序（在我的例子中是图像）。

Answer 4

您可以通过定义行为文件来禁用句柄的功能。我找不到任何可以让你隐藏手柄的东西。下面的代码的结果是拖动句柄没有任何效果。

noresize.htc：

<public:component lightweight="true">

    <script language="javascript">

    function CancelEvent()
    {
            return false ;
    }

this.onresizestart = CancelEvent ;
this.onbeforeeditfocus = CancelEvent ;

</script>

</public:component>

然后在css：

img.noresize {
    behaviour:url(/css/noresize.htc);
}

请注意，您需要将url（）路径设置为正确。将css类添加到要选择性禁用的图像中。

本文有一个替代的.htc文件，它对我不起作用：

http://nickw101.wordpress.com/2011/02/25/disabling-image-resizing-in-ie-contenteditable-elements/

Answer 5

有史以来最好的修复：

<div contenteditable="true">
    <label contenteditable="false"><input/></label>
</div>

或任何包装你的输入/ img

的html元素

在IE11上使用img也像魅力一样。

Answer 6

通常，您不希望任何元素的resize functionnality可访问。您可以设置onresizestart 容器的contenteditable处理程序，以便取消任何调整大小。那就是：

<div id="editor" contenteditable="true" onresizestart="return false;">
    <img src="..." />
</div>

或者使用JS：

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

这不会隐藏句柄，但无论用什么类型，用户都无法调整元素的大小。

希望这有帮助！

在IE的可信模式下，图像调整大小句柄

6 个答案: