CKEditor的

Question

我想更改tinyMCE textarea的高度，以便所有内容都可见，而无需滚动textarea本身，而是滚动主页面。

textarea的内容是动态改变的，所以它的高度应该自动调整。

<script>
    tinymce.init({
        selector: "textarea",
        plugins: ["code fullscreen"],
        toolbar: "bold italic | alignleft aligncenter alignright alignjustify"
    });
</script>

html

<form id='form1' action='?' method='post'>
    <input type='text' name='title' value='<?php echo $row['title'];?>'><br>
    <textarea name='content' ><?php echo $row['content'];?></textarea>
</form>

js

$('textarea').each(function() {
    $(this).height($(this).prop('scrollHeight'));
});

文本区域的内容现在是其两倍高，底部有很多空白区域。

我从其他帖子尝试了很多代码，但没有成功。

任何帮助？

Answer 1

我很困惑。您询问了CKEditor，但是您的代码建议您使用TinyMCE。虽然它们都支持自动高度调整，但它们是完全不同的编辑器。

CKEditor的

对于CKEditor，您需要加载autogrow插件。您可以在官方documentation

中了解详情

＆＃13;

CKEDITOR.replace('editor', {
  extraPlugins: 'autogrow'
});

＆＃13;

<script src="https://cdn.ckeditor.com/4.6.2/standard-all/ckeditor.js"></script>

<textarea id="editor"></textarea>

＆＃13;

如果上面的代码段无法运行，您可以查看this fiddle。

TinyMCE的

对于TinyMCE，您需要加载autoresize插件。您可以在官方documentation

中了解详情

＆＃13;

tinymce.init({
  selector: '#editor',
  plugins: ['autoresize']
});

＆＃13;

<script src="https://cdn.tinymce.com/4/tinymce.min.js"></script>

<textarea id="editor"></textarea>

＆＃13;

如果上面的代码段无法运行，您可以查看this fiddle。

tinyMCE textarea自动高度

1 个答案:

CKEditor的

TinyMCE的