我只是遇到一个奇怪的问题。我目前正在为我的网站创建一个简单的WYSIWYG-Editor。为此，我只使用带有contenteditable和一些document.execCommand命令的div。
要插入图像，我使用的是显示输入的模态。用户单击“插入”后，文件将被读取为base64并使用将其插入到我的文本框中
document.execCommand('insertHTML', false, '<img class='img-resizable' style='width: " + w + "px; height: " + h + "px;' src='" + reader.result + "'></div>");
所以基本上我有这样的结果：
<div class="n-edit-content" contenteditable=""><img class="img-resizable" style="width: 100px; height: 100px;" src="...base64" /></div>
到目前为止，一切都按预期工作。但是现在我添加了属性resize: both;和overflow: auto;，以便用户能够调整图像大小。但它没有用。只要我将img-Tag更改为div就可以了，但是用户可以在图像内部写入。
对于这个有诀窍还是错过了重要的事情？
我刚用chrome测试过，但由于该网站应该适用于所有主流浏览器，我觉得我不得不在另一个浏览器上测试它，直到它在chrome中工作。
问候 Neokil
编辑：因为有些人似乎不理解我的问题，我会再次尝试解释。我想要完成的是不要有一些响应式图像。用户应该能够通过在右下角点击并拖动来缩放图像。只需在css中设置resize:both即可获得的功能。问题是，这适用于所有div，文本框，...但我无法使用img-tags。