de Bernhard no funcionó para mí en TinyMCE 4.1.7, pero el código de abajo hace. Incluí un poco de contexto para poder hacerlo lo más claro posible.
Esto es de un creador de sitios web. El usuario abre un editor haciendo clic con el botón derecho en el DIV que desea editar y seleccionando "texto" en el menú contextual. Esto ejecuta un tinymce.init que conecta un panel de edición en línea al DIV. El control viene aquí cuando el editor ha sido agregado.
El primer editor.on
establece una devolución de llamada para capturar el final de la creación del editor y en ese momento dispara el foco para mostrar el editor. El segundo editor.on
capta un cambio en un lapso dentro de un li y realiza la actualización a la li. El tercero editor.on
capta el cierre del editor.
/************************************************************************************/
/* TinyMCE Events */
/************************************************************************************/
tinymce.on('AddEditor', function(e) {
// Once editor has been added show it by firing 'focusin' instead of waiting for a click
e.editor.on('NodeChange',function(e) {
e.target.fire('focusin'); // show the editor
});
// Update parent <li> to match a font-size or font-family change in text
e.editor.on('ExecCommand',function(e) {
var cmd = e.command;
if (cmd === "FontSize" || cmd === "FontName") {
var val = e.value;
var node = e.target.selection.getNode(); // editor in this event object is at target
var nodeParent = node.parentNode;
if (node.nodeName === "SPAN" && nodeParent.nodeName === "LI") {
// We're changing the style of a <span> that's inside an <li>.
// Change the <li> to match the new font-size or font-family.
// (B, U, and forecolor buttons don't come here so we can't update li here for those)
nodeParent$ = $(nodeParent);
nodeParent$.removeAttr('data-mce-style');
if(cmd === "FontSize") {
nodeParent$.css('font-size',val);
}
if(cmd === "FontName") {
nodeParent$.css('font-family',val);
}
}
}
});
// When editor is removed (by clicking in a blank area of the inline panel)
// restore draggability to the DIV (had to kill before tinymce.init because draggability
// and contenteditable don't work together).
e.editor.on('RemoveEditor',function(e) {
g.currentElement$.attr('editor_state', "off")
.draggable('enable') // make DIV draggable again
.removeClass('textCursor'); // give DIV back its pointer cursor
});
});
Sí. Creo que lo que estoy buscando es dónde y cómo hacerlo. – lambmj
Sin embargo, si está creando algo para el cual el usuario final no tendría acceso a la parte HTML del mismo, entonces no puede lograr este método. – Dez