Need to autosave TinyMCE

问题

I am looking for some help autosaving tinyMCE. I want to save the content within tiny into its respective textarea after content has been updated. So that when I make an ajax call the content is in the textarea ready to be posted.

Currently I have this little bit of code but it only updates the text area when you press a button in tiny (like bold, italics, underline, etc). I also have the link where I found the code. Any help would be appreciated.

$('.AjaxEdit textarea.tiny').tinymce({

    //other init options

    //need this function to save tiny data before Ajax call
    //http://www.webmasterkitchen.com/article/tinymce-ajax-form-submission/
    setup : function(ed) {
        ed.onChange.add(function(ed) {
            tinyMCE.triggerSave();
        });
    }
});

回答1:

You're best bet is to adjust your AJAX call so it pulls the content straight from TinyMCE or triggerSave just before the AJAX call rather than trying to constantly have the textarea in sync with the editor content. Serialising and filtering the entire document so it can be stored on every change is a major performance hit.

If you really need to keep the textarea in sync, you'd have to add DOM modification listeners to the document in the iframe that TinyMCE creates to store the content - you can retrieve it with the getDoc() function (see http://tinymce.ephox.com/documentation/api/index.html#class_tinymce.Editor.html-getDoc). You are going to have major performance problems here though.

Regards,

Adrian Sutton
http://tinymce.ephox.com

回答2:

Though the question is quite old, I've came accross while searching for a plugin. At the end I've implemented my own plugin.

I have written a plugin that sends the form data to the specified url every x seconds. I have blogged it here.

In short, the idea is to create an iframe, change the target and action of the form dynamically, and submit the form to stimulate an ajax effect. Once saved, I am putting the form element into its initial state so that if the user wants to save manually he or she will not have any difficulties.

Please note that the plugin I've written is for tinymce4. You'll have to change the source code a bit for older versions.

回答3:

You should take a look at this autosave plugin http://code.google.com/p/tinyautosave/

回答4:

FYI, I have done it like this:

$('textarea.wysiwyg').tinymce({
  ...

  onchange_callback : function(inst) {

    // Prints the DOM element (textarea) to the console.
    console.log( inst.getElement() );

    // Prints the content of tinyMCE to the console.
    console.log( inst.getBody().innerHTML );

  }

});

Official documentation on the onchange_callback event

来源：https://stackoverflow.com/questions/1953384/need-to-autosave-tinymce

标签

javascript

ajax

tinymce