javascript - 防止在 IE 中的 contenteditable div 中调整按钮大小

Question

我们有一个带样式的禁用输入，类型为按钮，我们将其用作内容可编辑区域中其他内容的占位符。问题是 IE(我们专门针对 IE10)似乎完全忽略了 resizestart 事件，因此当您单击该元素时，您可以调整它的大小。我们想阻止这种情况，但仍然允许选择和拖动元素。这似乎对图像有效。

这里选择元素背后的故事很长，所以现在假设我们不能改变元素。

更新:这是一个 jsfiddle在此处演示问题和相关示例代码:

<div contenteditable="true">
    <input type="button" value="test" disabled="disabled" onresizestart="return false;" onresize="return false;" id="test" />
</div>

Answer 1

这远非理想，但有效。您可以捕获容器 的“mouseup”事件并在那里重置控件的宽度和高度:

$('#container').mouseup(function(e){
    var $btn = $("#test");
    $btn.css('width','');
    $btn.css('height','')
})

这不会删除调整大小的方 block ，视觉上用户可以临时调整控件的大小，但只要松开鼠标按钮 - 控件就会捕捉到原始大小。

演示:http://jsfiddle.net/5swkeqh9/2/