tiny mce can't be inited when load js dynamica

2019-02-05 13:49发布

站内文章 / 前端开发
44 0 0

问题:

i am having trouble with tinyMCE, when i put <script type="text/javascript" src="/scripts/tiny_mce/tiny_mce.js"> to <head>, and put init code before the <textarea class="tinyMceEditor">, it works fine. the init code is like this:

                    tinyMCE.init({
                        mode : "specific_textareas",
                        editor_selector : "tinyMceEditor",
                        plugins : "inlinepopups,advlink",
                        convert_urls : false,
                        theme : "advanced",
                        theme_advanced_buttons1 : "link,unlink",
                        width: "602",
                        height: "175",
                        theme_advanced_statusbar_location : "none"});

But now, i want to defer the loading of tiny_mce.js, when user click a button on the first time, the tiny_mce.js will be loaded, and then append the <textarea class="tinyMceEditor"> to <body>, then do the init work with the previous code, but this time, it won't init the tinyMCE editor, it only shows the <textarea class="tinyMceEditor">

googled, but find nothing related to this, anyone has met this problem?

Any suggestion will be appreciated.

i looked into chrome web developer tools and found that if i dynamically load the tinymce.js, other js needed like en.js, editor_template.js, editor_plugin.js etc won't be loaded. even when i add these js files to dynamically loading, the tinymce still can't be inited.

thank you for your help, i watched in firebug, and i do get the tinymce.js loaded before append <textarea to <body>, then i append the <textarea>, and do the tinymce init(), i am using LazyLoad(jQuery plugin) to dynamically load the js files.

here is what i did

if(typeof TinyMCE == "undefined"){
    //dynamically load the tinymce.js
    LazyLoad(['tinymce.js'],function(){
        //callback function, called after tinymce is loaded
        $('body').append('<textarea class="TinyMceEditor"/>');
        tinyMCE.init({init settings});
    });
}

if i don't load tinymce.js dynamically, just put a <script> tag in <head>, the tinyMCE can be inited , but when i load tinymce.js dynamically, it doesn't work. Any idea with this?

回答1:

after a day's work, finally found the solution, just put

 window.tinymce.dom.Event.domLoaded = true;

before 

 tinymce.init();

then the tinymce can be inited correctly.



标签： tinymce initialization init dynamic-loading
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~