2011-03-04 9 views
7

Estoy usando los siguientes códigos para obtener el texto de tinymce.Cómo insertar una imagen en la posición del cursor en tinymce

tinymce_content=tinyMCE.get('txt_area_id').getContent(); 
updated_content=tinymce_content+"<img src="sample.jpg">"; 

Al usar los códigos anteriores, estoy insertando la imagen dentro del contenido de tinymce.

Pregunta: Cómo insertar la imagen en la posición del cursor dentro de tinymce (es decir) Cómo predecir la posición del cursor y dividir el contenido para insertar la imagen entre el contenido recuperado.

Gracias de antemano

Respuesta

18

Esto insertará un nodo de imagen en el lugar seleccionado (posición del cursor) en un editor de tinymce

var ed = tinyMCE.get('txt_area_id');    // get editor instance 
var range = ed.selection.getRng();     // get range 
var newNode = ed.getDoc().createElement ("img"); // create img node 
newNode.src="sample.jpg";       // add src attribute 
range.insertNode(newNode);       // insert Node 
+1

Grande, cada vez que me sentí lucha en tinymce , recuerdo thariama Gracias –

+0

contento de haber podido ayudar – Thariama

+0

Solo para hacer que esta publicación sea impresionante ahora un poco más clara ... Para actualizar la imagen y asegurarse de que se renderiza correctamente, debes asegurarte de que estás creando el elemento en tinyMCE's DOM no la ventana DOM. Entonces, si usa 'createElement', asegúrese de hacer algo como' opener.tinyMCE.selectedInstance.getDoc(). CreateElement'. – Stewart

8

@Thariama's answer funcionó bien para mí en Chrome, pero no en IE. Tuve que modificarlo para que la siguiente a conseguir que funcione en ambos navegadores:

var ed = tinyMCE.get('txt_area_id');    // get editor instance 
var newNode = ed.getDoc().createElement ("img"); // create img node 
newNode.src="sample.jpg";       // add src attribute 
ed.execCommand('mceInsertContent', false, newNode.outerHTML) 

(IE me estaba diciendo que range no tenían un método insertNode.)

+0

Ambas soluciones no funcionan para yo. Mi IE dice: "SCRIPT16389: Erro não especificado." lo que significa "Error no especificado en inglés ... Usando IE9 y minúsculo 3.4 – Filipiz

+0

Estoy usando tinymce 4.0. Está funcionando bien en IE10, pero obteniendo el siguiente error en IE11 SCRIPT16389: Función incorrecta. Archivo: tinymce.min.js, Línea: 8, Columna: 20915 ¿Puedes ayudarme? –

Cuestiones relacionadas