tinyMCE 4 instance after mceAddEditor really tall

问题

Pre-note: This issue occurs whether or not I already have a textarea on the page.

I have a button that triggers an ajax request first...writing something to a database and returning the key. I use that key in my ID for the textarea that is then dynamically added to page. Keep in mind that tinyMCE is already initialized.

tinymce.init({
        selector: ".editor",
        setup: function(ed) {
            ed.on('change', function(e) {
                tinymce.triggerSave();
                $('form').trigger('checkform.areYouSure');
            });
            ed.on('init', function(e) {
                autoresize_max_height: 500
            });
        },
        plugins: [
            "advlist autolink link responsivefilemanager lists charmap print preview hr anchor pagebreak spellchecker",
            "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
            "save table contextmenu directionality template paste textcolor colorpicker responsivefilemanager autoresize"
        ],
        toolbar: "undo redo | styleselect | bold italic | forecolor backcolor | alignleft aligncenter alignright | bullist numlist | outdent indent | table | link responsivefilemanager",
        image_advtab: true ,

        external_filemanager_path:"/filemanager/",
        filemanager_title:"Filemanager" ,
        external_plugins: { "filemanager" : "/filemanager/plugin.min.js"},
    });

After the textarea is dynamically created, I add some default 'Lorem Ipsum' text and call mceAddEditor

tinymce.execCommand('mceAddEditor', false, "custom-html_" + data.c2akey);

data.c2akey is the key returned from the ajax call.

The tinymce instance is created successfully.

Here's the problem:

1) The instance is super tall. Unless I set a static height on the parent container the textarea is, the editor is really tall. Taller than 500px (from autoresize_max_height). Problem with setting a static height on the parent container is that autoresize wont work. Also I dont see the text from the textarea in this new editor.

2) I can not type in this newly created instance. See Can't type in tinyMCE 4 instance after mceAddEditor

So I need help figuring out why the instance is super tall on creating.

回答1:

Your first problem (The instance is super tall) I've solved as follows:

tinymce.init({
    ...
    init_instance_callback : function(editor) {
         $(editor.iframeElement)
                .contents()
                .find('body')
                .css('min-height', editor.targetElm.rows * 9);
    }
});

来源：https://stackoverflow.com/questions/26737525/tinymce-4-instance-after-mceaddeditor-really-tall

标签

tinymce-4