TinyMCE: tinyMCE.init() еще не добавлено <textarea>

Question

Итак, в основном, я хочу создать богатый текст, даже если нет <textarea>. Я хочу добавить сам richtextbox. Не от tinyMCE. Проблема в том, что я думаю, что после добавления этого, у меня не будет никаких событий tinyMCE.

То, что я имею в виду, как ...

$("<textarea></textarea>").tinyMCE({options}) и это возвращает HTML строку в RichTextBox. Таким образом, я могу добавить строку html самостоятельно. Обратите внимание, что он должен отлично работать, особенно события.

Возможно ли это?

Answer 1

Вы можете создать <textarea> через javascript и добавить его в DOM перед тем, как вы хотите отобразить редактор на экране. Однако для текстового поля вам необходимо использовать id.

//an editor id needs to be used in this method 
var editorId = "#myId"; 
var options = { 
    //options 

} 
//Creates an editor instance and adds it to the EditorManager collection. 
tinyMCE.createEditor(editorId, options); 

//get the editor instance by its id 
var editor = tinyMCE.get(editorId); 

//get the root element you want insert the editor into. (E.g. body element) 
var root = document.getElementsByTagName('body')[0]; 

//create a textarea element 
var textarea = document.createElement("textarea"); 
//set its id 
textarea.setAttribute("id", editorId); 
//append it to the root element 
root.appendChild(textarea); 

//register your events 
registerEvents(editor); 

//display editor on screen 
editor.render(); 
//set content of editor 
editor.setContent("<h1>Hello World!</h1><p>Hello World!</p>"); 

//retrieve content from editor 
var htmlContent = editor.getContent(); 

console.log(htmlContent); 

function registerEvents(editor) { 
    editor.on("init", function(e) { 
    console.log("Init", e); 
    }); 

    editor.on("focus", function(e){ 
    console.log("Focus", e); 
    }); 

    editor.on("blur", function(e){ 
    console.log("Blur", e); 
    }); 
} 

Вот пример на JSFiddle.