jquery - is there a way to load an external javascript file inside the tinymce iframe? - Stack Overflow

admin管理员组

文章数量:1279176

Is there a simple way to load external javascript that will work inside of a TinyMCE iframe?

The only thing I've found (that might be the answer) is this: .php/API3:class.tinymce.dom.ScriptLoader

But I'm not sure how to load this properly or if it works at all. I tried to load it before and after the tinymce.init directive, even inside it, but nothing seems to work. Just wondering how to intiailize the "ScriptLoader" function.

Is there a simple way to load external javascript that will work inside of a TinyMCE iframe?

The only thing I've found (that might be the answer) is this: http://www.tinymce./wiki.php/API3:class.tinymce.dom.ScriptLoader

But I'm not sure how to load this properly or if it works at all. I tried to load it before and after the tinymce.init directive, even inside it, but nothing seems to work. Just wondering how to intiailize the "ScriptLoader" function.

• javascript
• jquery
• tinymce

Share Improve this question Follow asked Sep 12, 2012 at 23:39 James NineJames Nine 2,6181111 gold badges3838 silver badges5454 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 8

You may use the scriptloader using the setup init configuration paramter

tinyMCE.init({
   ...
   setup : function(ed) {
      ed.onInit.add(function(ed, evt) {

        // Load a script from a specific URL using the global script loader
        tinymce.ScriptLoader.load('somescript.js');

        // Load a script using a unique instance of the script loader
        var scriptLoader = new tinymce.dom.ScriptLoader();

        scriptLoader.load('somescript.js');

      });
   }
});

In order to do this with the jquery plugin, I needed to do this:

$('textarea').tinymce({
...
  setup: function(editor) {

    var scriptLoader = new tinymce.dom.ScriptLoader();
    scriptLoader.add("Your first script");
    scriptLoader.add("Your second script");
    scriptLoader.loadQueue();

    ...
  });
});

Another Approach to definitely try on is mentioned below, Now after the editor is initialized, we can access the elements of the iframe and insert or js there. Please note, that if you want to save the script paths with the html source code, then add the scripts in side body else I am adding it in head section because I just want to preview the things.

tinymce.init({
    ...,
    setup : function(ed){
  
              ed.on('init',function(){
                  console.log('Initialized')
                  var head = ed.dom.select('head')[0]
                  //for body //var body = ed.dom.select('body')[0]
                  ed.dom.add(
                            head,
                            'script',
                            {
                                src: "/path/to/file1.js",
                                type: 'text/javascript'
                            }
                        );
                  
                  ed.dom.add(
                            head,
                            'script',
                            {
                                src: "/path/to/file1.js",
                                type: 'text/javascript'
                            }
                        );
                  
                  
              })
              
          }
});

By this, you can add Multiple JS Files once the editor is fully initialized.

本文标签： jqueryis there a way to load an external javascript file inside the tinymce iframeStack Overflow