Php 加载多个TinyMCE实例会冻结浏览器，解决方案是什么？

我有一个同时运行多个tinymce实例的页面，它在加载时会冻结浏览器。在我再次使用浏览器之前，至少需要等待15秒。我已经在IE9、FF6和Chrome上进行了测试，它们在加载时都冻结了一段时间

我怎样才能防止这种冰冻的发生？我有至少10个文本区与tinymce附加到它在一个页面上。这台计算机运行在core2duo上，内存为4GB，没有运行任何其他程序，但这并不重要，因为即使在规格较低的PC上，它也应该可以工作

编辑添加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"
    }

});

var myTextbox=“10此处文本区域的名称”；
tinyMCE.init({
//一般选择
模式：“精确”，
元素：myTextbox，
主题：“高级”，
插件：“粘贴，ibrowser”，
粘贴\删除\样式：true，
粘贴上的自动清理粘贴：true，
插件：“自动链接、列表、分页符、样式、图层、表格、保存、advhr、advimage、advlink、情感、易趣、内嵌弹出窗口、插入日期时间、预览、媒体、搜索替换、打印、上下文菜单、粘贴、方向性、全屏、不可编辑、可视光标、不可中断、xhtmlxtras、模板、字数、advlist、自动保存”，
//主题选项
主题高级按钮1：“粗体、斜体、下划线、删除线、左对齐、居中对齐、右对齐、全对齐、样式选择、格式选择、字体选择、字体大小选择”，
主题|高级|按钮2：“bullist，numlist，|，outdent，indent，blockquote，|，undo，redo，|，link，unlink，anchor，image，cleanup，help，code，|，insertdate，inserttime，preview，|，forecolor，backcolor”，
主题|高级|按钮3：“表格控件，|，hr，removeformat，visualaid，|，sub，sup，|，打印，|，ltr，rtl，|，全屏”，
主题高级按钮4：“插入层，向前移动，向后移动，绝对，|，styleprops，|，引用，缩写，首字母缩略词，del，ins，attribs，|，visualchars，nonbreaking，template，pagebreak，restoredraft，|，charmap，情感，iespell，media，advhr，”，
主题\高级\按钮5：“粘贴文本、粘贴单词、选择全部、iuploader、上载\状态”，
主题\高级\工具栏\位置：“顶部”，
主题\高级\工具栏\对齐：“左”，
主题\高级\状态栏\位置：“底部”，
主题\u高级\u大小调整：正确，
设置：功能（ed）{
//图像上传器按钮
ed.addButton（'iuploader'{
标题：“上传图像”，
图片：'/www/images/admin/post_button_image_upload.gif'，
onclick:function（）{
加载图像上传器（this.id）；
}
}),
ed.addButton（“上传状态”{
标题：“上传状态”，
图像：“”，
onclick:function（）{
}
});
},
//内容CSS
content\u css:“/www/js/tiny\u mce/css/content.css”，
//链接/图像/媒体/模板对话框的下拉列表
template\u external\u list\u url:“lists/template\u list.js”，
外部链接列表url:“lists/link\u list.js”，
外部图片列表url:“lists/image\u list.js”，
媒体\u外部\u列表\u url:“lists/media\u list.js”，
//样式格式
样式和格式：[
{标题：“粗体文本”，内联：“b'}，
{标题：'Red text'，内联：'span'，样式：{color:'#ff0000'}}，
{title:'Red header'，block:'h1'，style:{color:'#ff0000'}}，
{title:'example1'，inline:'span'，classes:'example1'}，
{title:'example2'，inline:'span'，classes:'example2'}，
{title:'表格样式'}，
{title:'Table row 1'，选择器：'tr'，类：'tablerow 1'}
],
//替换模板插件的值
模板替换值：{
用户名：“某个用户”，
标记：“991234”
}
});

---

Brett Henderson是对的，加载10个实例需要时间。但是，您永远不会一次编辑10，因此仅为用户想要使用的区域打开TinyMCE将使您达到目的

单击为所有文本区域创建TinyMCE实例的代码：

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

并将模式更改为无：

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

    /* 
       other options etc 
    */

});

---

Brett Henderson是对的，加载10个实例需要时间。但是，您永远不会一次编辑10，因此仅为用户想要使用的区域打开TinyMCE将使您达到目的

单击为所有文本区域创建TinyMCE实例的代码：

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

并将模式更改为无：

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

    /* 
       other options etc 
    */

});

tinyMCE.init({
模式：“精确”，
元素：“ajaxfilemanager，ajaxfilemanager_1”，
主题：“先进”。。。。

tinyMCE.init({
模式：“精确”，
元素：“ajaxfilemanager，ajaxfilemanager_1”，
主题：“先进”。。。。

我使用单击事件在单击的文本区域加载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 -------------
            });

---

我使用单击事件在单击的文本区域加载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 -------------
            });

---

问题是TinyMCE加载的iFrame数量与实例数量相同。在您的情况下，更好的选择可能是使用内联版本。问题是TinyMCE加载的iFrame数量与实例数量相同。在您的情况下，更好的选择可能是使用内联版本。您如何将TinyMCE编辑器实例分配到文本区域元素？请发布您的代码。添加了将tinymce加载到相关页面的JS代码。我怀疑简单地将10多个textareas全部转换为tinymce将是一个问题，因为在每种情况下，都需要创建一个新的tinymce实例。您是否考虑过只为最终用户想要使用的textarea打开tinymce（比如使用“编辑”按钮或onclick事件）而不是在页面加载时打开所有html元素？确保所有html元素（“myTextbox”）都有不同的ID。您如何将Tinymce编辑器实例分配到textarea元素上？请发布您的代码。添加了加载Tinymce t的JS代码