我有一个TinyMCE编辑器,它设置在TextArea上,我希望这个编辑区始终占据其父div的所有空间。
我有一个JS函数,可以获取当前空间并将textarea.style.height设置为它,但是当我启用TinyMCE时,它似乎停止工作。
此外,TextArea的宽度为100%; 当使用TinyMCE时,它不会通过HTML渲染进行调整大小。
有什么想法吗?
我有一个TinyMCE编辑器,它设置在TextArea上,我希望这个编辑区始终占据其父div的所有空间。
我有一个JS函数,可以获取当前空间并将textarea.style.height设置为它,但是当我启用TinyMCE时,它似乎停止工作。
此外,TextArea的宽度为100%; 当使用TinyMCE时,它不会通过HTML渲染进行调整大小。
有什么想法吗?
对我来说,这些解决方案都没有完全奏效。我需要在初始化和编辑期间调整高度。我的做法是获取 iFrame 中 HTML 元素的高度,然后将其应用到 iFrame 上,并额外增加 100px 的高度。
以下是我的解决方案:(为响应式图片添加了 img 最大宽度)
setup: function(editor) {
editor.on('init', function (e) {
$("#editor_textarea_ifr").contents().find('img').css("max-width","100%");
iframeHeight = $("#editor_textarea_ifr").contents().find("html").height();
$("#editor_textarea_ifr").css("height",iframeHeight + 100);
});
},
init_instance_callback: function (editor) {
editor.on('NodeChange', function (e) {
$("#editor_textarea_ifr").contents().find('img').css("max-width","100%");
iframeHeight = $("#editor_textarea_ifr").contents().find("html").height();
$("#editor_textarea_ifr").css("height",iframeHeight + 100);
});
}
iframe的包装器(其ID以_ifr结尾)是具有应用程序角色的span的第一个父级。因此,要获取包装器:
$('span[role=application]').parents(':eq(0)')
所以要调整高度:
$('[id$=_ifr]').css('height',$('span[role=application]').parents(':eq(0)').css('height'))
调整宽度
$('[id$=_ifr]').css('width',$('span[role=application]').parents(':eq(0)').css('width'))