Загрузка нескольких экземпляров TinyMCE останавливает браузер, решение?

Question

У меня есть страница с несколькими экземплярами tinymce, работающими одновременно, и браузер зависает при каждой загрузке.Это займет не менее 15 секунд ожидания, прежде чем я смогу снова использовать браузер.Я проверил это на IE9, FF6 и Chrome, и все они некоторое время зависают во время загрузки.

Как можно предотвратить это замораживание?У меня есть по крайней мере 10 текстовых областей с tinymce, прикрепленным к нему на одной странице.Компьютер работает на core2duo с 4 ГБ ОЗУ без запуска других программ, но это не должно иметь значения, так как предполагается, что он будет работать даже на ПК с более низкой спецификацией.

Редактировать добавить код JS для загрузки TinyMCE.

<script type="text/javascript">
var myTextbox = "10 name of textarea here";

tinyMCE.init({
    // General options
    mode : "exact",
    elements: myTextbox,
    theme : "advanced",
    plugins : "paste,ibrowser",
    paste_remove_styles: true,
    paste_auto_cleanup_on_paste : true,
    plugins : "autolink,lists,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave",
    // Theme options
    theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
    theme_advanced_buttons2 : "bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
    theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,print,|,ltr,rtl,|,fullscreen",
    theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak,restoredraft,|,charmap,emotions,iespell,media,advhr,",
    theme_advanced_buttons5 : "pastetext,pasteword,selectall,iuploader,upload_status",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,

    setup : function(ed) {
    //IMAGE UPLOADER BUTTON 
    ed.addButton('iuploader', {
        title : 'Upload Image',
        image : '/www/images/admin/post_button_image_upload.gif',
        onclick : function() {
            load_image_uploader(this.id);
         }
      }),
    ed.addButton('upload_status', {
        title : 'Upload Status',
        image : '',
        onclick : function() {

         }
      });
    },

    // Content CSS
    content_css : "/www/js/tiny_mce/css/content.css",

    // Drop lists for link/image/media/template dialogs
    template_external_list_url : "lists/template_list.js",
    external_link_list_url : "lists/link_list.js",
    external_image_list_url : "lists/image_list.js",
    media_external_list_url : "lists/media_list.js",

    // Style formats
    style_formats : [
        {title : 'Bold text', inline : 'b'},
        {title : 'Red text', inline : 'span', styles : {color : '#ff0000'}},
        {title : 'Red header', block : 'h1', styles : {color : '#ff0000'}},
        {title : 'Example 1', inline : 'span', classes : 'example1'},
        {title : 'Example 2', inline : 'span', classes : 'example2'},
        {title : 'Table styles'},
        {title : 'Table row 1', selector : 'tr', classes : 'tablerow1'}
    ],

    // Replace values for the template plugin
    template_replace_values : {
        username : "Some User",
        staffid : "991234"
    }

});

Answer 1

Бретт Хендерсон прав, загрузка 10 экземпляров требует времени.Но вы никогда не будете редактировать 10 сразу, поэтому открытие TinyMCE только для областей, с которыми пользователь хочет работать, приведет вас туда.

Код для создания экземпляра TinyMCE для всех текстовых областей при нажатии:

$$('textarea').each(function(e) {
    e.addEvent( 'click', function() {
        tinyMCE.execCommand('mceAddControl', false, e.getProperty('id')) ;
    });
});

и измените режим на none:

tinyMCE.init({
    // General options
    mode : "none",

    /* 
       other options etc 
    */

});

Answer 2

tinyMCE.init({
            mode : "exact",
            elements : "ajaxfilemanager, ajaxfilemanager_1",
            theme : "advanced", ....



<textarea id="ajaxfilemanager" name="ajaxfilemanager" style="width: 100%; height: 500px" ></textarea>
<textarea id="ajaxfilemanager1" name="ajaxfilemanager_1" style="width: 100%; height: 500px" ></textarea>

Answer 3

Я использую событие щелчка, чтобы загрузить tinyMCE для нажатой текстовой области, это помогло мне использовать несколько редакторов tinyMCE на одной странице, не останавливая браузер, это может быть неправильно, но это работает для меня.код:

            $('textarea').click(function(){
                $(this).addClass("tinyopen");
                //tinyMCE -------------
                    tinyMCE.init({

                        mode : "specific_textareas",
                        editor_selector : "tinyopen",

                        //  -----  Here comes your plugins and themes --------- //
                        //                                                      //  
                        //                                                      //  
                        //                                                      //
                        //  --------------------------------------------------- //

                        content_css : "path to css"

                    });
                //tinyMCE -------------
            });