Foros del Web » Programando para Internet » Javascript »

Crear editor WYSIWYG que de el mismo formato en distintos navegadores

Estas en el tema de Crear editor WYSIWYG que de el mismo formato en distintos navegadores en el foro de Javascript en Foros del Web. Estoy planteándome el crear un editor WYSIWYG para un proyecto personal (y para saber hacerlo, que nunca estará de más en según qué proyectos para ...
  #1 (permalink)  
Antiguo 03/03/2008, 11:42
 
Fecha de Ingreso: diciembre-2005
Ubicación: Redondela (Galicia)
Mensajes: 368
Antigüedad: 18 años, 3 meses
Puntos: 1
Crear editor WYSIWYG que de el mismo formato en distintos navegadores

Estoy planteándome el crear un editor WYSIWYG para un proyecto personal (y para saber hacerlo, que nunca estará de más en según qué proyectos para clientes).

Estoy utilizando el típico método de un iframe con designMode='on', pero me encuentro con el problema de que cada navegador crea el HTML según le parece.

Por ejemplo, si tienes el campo vacío y te pones a escribir, Firefox escribe texto plano pero incluyendo en lugar de cada salto de línea, un <br />. Sin embargo, si estás en un párrafo ya creado y pulsas intro, Firefox crea un nuevo párrafo por tí (osea, engloba las líneas con <p> y </p>). Este es también el comportamiento del IE y Opera, pero incluso ya con el campo en blanco, todo lo que escribas aparecerá en párrafos.Pero estos dos últimos insertan saltos de línea y ponen las etiquetas HTML en mayúsculas.

Podéis probar todo esto que os comento en http://spaweditor.com/en/disp.php/en...w/en_spaw_demo, por ejemplo, cambiando entre el modo de diseño y el modo HTML.

Espero haberme explicado bien. Las diferencias entre los navegadores harían necesario un trabajo (a parte del de las comprobaciones de seguridad) por parte del servidor para dar formato al texto y que sea igual independientemente del navegador utilizado por el usuario.

Pues bueno, buscando hoy casi toda la tarde me he encontrado con un editor WYSIWYG distinto: FCKEditor. Este editor me llama la atención porque crea el mismo código en IE y en Firefox (no soporta Opera, pero puede que sea por otras funcionalidades y no por esta, que es la que me interesa). Podéis probarlo (http://www.fckeditor.net/demo), y comprobaréis lo que digo: Escribiendo con el campo vacío crea párrafos (el Firefox lo hace mal), y sus etiquetas están en minúsculas (incluso utilizando IE).

Y ahora llega el momento de pediros ayuda, pues aunque el proyecto es Open Source, yo no tengo el nivel suficiente en JavaScript para encontrar el porqué de este comportamiento que tanto me interesa, ya que el proyecto es grande y complejo.

¿Alguna idea de como implementar este comportamiento?

Saludos, y gracias por vuestro tiempo
  #2 (permalink)  
Antiguo 10/02/2010, 10:29
 
Fecha de Ingreso: febrero-2010
Mensajes: 1
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: Crear editor WYSIWYG que de el mismo formato en distintos navegadores

BUENO SE KE YA ES MUY TARDE COMO LA ARROLLADORA DICE, Y PUES SI ENTRARAS AL CODE JS PUES VEERIAS KE CON SHIFT Y ENTER PODRIAS CONTINUAR NORMAL :p, ESTO ES A CAUSA DE UN EVENTO KEYPRESS KE SE LE AGREGA AL WYSIWYG PARA CAPTURAR ESO:

ESTE ES EL EJEMPLO DE UNO KE ES OPENSOURCE TAMBIEN, MUY BUENO LA VERDAD LLAMADO openwysiwyg_v1.4.7

if (editor.event.keyCode==13) {
if (!editor.event.shiftKey) {
sel = this.getRange(this.getSelection(n));
sel.pasteHTML("<br>");
editor.event.cancelBubble = true;
editor.event.returnValue = false;
sel.select();
sel.moveEnd("character", 1);
sel.moveStart("character", 1);
sel.collapse(false);
return false;
}
else {
sel = this.getRange(this.getSelection(n));
sel.pasteHTML("<p>");
editor.event.cancelBubble = true;
editor.event.returnValue = false;
sel.select();
sel.moveEnd("character", 1);
sel.moveStart("character", 1);
sel.collapse(false);
return false;
}

COMO OS DIGO, PODEIS MODIFICAR EL SOURCE A VOS GUSTO.
E IGUAL ANALIZAR ESTE PARA VOS WYSIWYG

SALUDOS DESDE MEXIKE
  #3 (permalink)  
Antiguo 10/02/2010, 10:41
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 22 años, 1 mes
Puntos: 772
Respuesta: Crear editor WYSIWYG que de el mismo formato en distintos navegadores

Hola leonahexe

Te recuerdo el aviso que había al final de este tema y que parece que no has leído.



Importante -> Ortografía en Foros del Web

Tema cerrado.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 12:23.