Entfernen Sie das TinyMCE-Steuerelement und fügen Sie es erneut hinzu

Ich habe eine js-Anwendung, mit der die Seite niemals neu geladen wird. Wenn ich also navigiere, muss ich die TinyMCE-Steuerelemente vollständig entfernen und dann neu initialisieren, wenn ich zu einem Bereich navigiere, der sie benötigt. Ich habe die akzeptierte Antwort auf diese Frage versucht, aber es scheint nichts zu tun.

Wie entferne ich tinyMCE und füge es erneut hinzu?

<code> tinymce.EditorManager.execCommand('mceRemoveControl',true, editor_id);
</code>

und meine spezifische Implimentation:

<code>  //if I throw an alert here, it does get called, so I know it's not null
  if (tinyMCE.getInstanceById("main-text"))
            tinyMCE.EditorManager.execCommand('mceRemoveControl', true, "main-text");
</code>

Ich habe es auch versucht

<code>  tinyMCE.remove( tinyMCE.getInstanceById("main-text"));
  // AND
  tinyMCE.remove( "main-text");
</code>

Ich weiß, dass diese Anweisung ausgeführt wird, wenn ich eine Warnung in die Bedingung setze. Ich weiß, dass dies die richtige ID ist. Ist in der API noch etwas vergraben, das mir fehlt? Dies ist nicht die jQuery-Version. Der Editor bleibt nach dem Entfernungsversuch bestehen, und ich erhalte sogar einen neuen mit derselben ID, wenn ich ihn erneut initialisiere, indem ich zum Status mit dem Formular zurück navigiere.

BEARBEITEN: Die unten stehende Lösung funktioniert im aktuellen Build 3.5b3 nicht, nur in 3.4.9. Es gibt einen Fehler, bei dem 't undefined' ist

Für alle Fälle ist dies der relevante Teil des DOM nach dem Init.

<code> <textarea id="main-text" style="display: none;" aria-hidden="true"></textarea>
<span id="main-text_parent" class="mceEditor defaultSkin" role="application" aria-labelledby="main-text_voice" style="display: inherit;">
<span id="main-text_voice" class="mceVoiceLabel" style="display:none;">Rich Text Area</span>
<table id="main-text_tbl" class="mceLayout" cellspacing="0" cellpadding="0" role="presentation" style="width: 100%; height: 400px;">
<tbody>
<tr class="mceFirst" role="presentation">
<td class="mceToolbar mceLeft mceFirst mceLast" role="presentation">
<div id="main-text_toolbargroup" aria-labelledby="main-text_toolbargroup_voice" role="group" tabindex="-1">
<span role="application">
</div>
<a onfocus="tinyMCE.getInstanceById('main-text').focus();" title="Jump to tool buttons - Alt+Q, Jump to editor - Alt-Z, Jump to element path - Alt-X" accesskey="z" href="#"></a>
</td>
</tr>
<tr>
<tr class="mceLast">
</tbody>
</table>
</span>
</code>

Antworten auf die Frage(2)

Ihre Antwort auf die Frage