CKeditor自动增长插件在引导选项卡内

CKeditor autogrow plugin inside Bootstrap tabs

本文关键字:选项 插件 CKeditor      更新时间:2023-09-26

我在引导选项卡中使用了多个 CKeditors(最新版本,4.5.7(。我想将自动增长添加到编辑器中,以便它们始终适合内容。我安装了插件,并在我的配置中安装了它:

config.autoGrow_minHeight = 500;
config.autoGrow_onStartup = true;

它适用于第一个(可见(编辑器,但是当我单击一个选项卡时,其他编辑器是巨大的 - 数千像素高。一旦我在编辑器中单击,它的大小就会调整为正确的大小。

下面是一个完整的演示:http://85.159.215.184/cke-grow/- 单击选项卡 2 以查看问题。

这可能是 CKeditor 中的一个错误,但由于他们的错误报告网站不起作用,我在这里询问以防有简单的修复或解决方法。有什么帮助吗?

我想出了一个解决方案:在切换选项卡时自动聚焦编辑器。

// hook into Bootstrap's tab JS
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
    // get the ID of the textarea (I have IDs based on the tab pane ID)
    var paneId = $(this).attr('href').replace('#', '');
    var textareaId = 'content-'+paneId;
    // get the CKEditor instance and focus it
    CKEDITOR.instances[textareaId].focus();
});