Me preguntaba cómo mantener el formato online rich text editors al pegar texto de una página web o documento. Un cuadro de texto estándar solo toma texto mientras estos editores WYSIWYG parecen usar un DIV. ¿Como funciona?¿Cómo funcionan los editores de texto enriquecido en línea?
Los editores de texto enriquecido en línea usan contentEditable o designMode para aprovechar la compatibilidad nativa del navegador para la edición de HTML. Cuando pegue en un elemento contentEditable o designMode, el navegador coloca HTML directamente en el elemento. Inténtalo tú mismo pegándote en Midas Demo y luego usando el elemento de inspección de Firebug para mirar el HTML que pegaste.
Las aplicaciones de JavaScript pueden usar el método execCommand para formatear la selección del usuario en un editor de texto enriquecido.
WYSIWYG Los editores en realidad se basan en la funcionalidad básica de edición HTML que los navegadores ya han incorporado. En Firefox, la tecnología se llama Midas. En IE, contentEditable.
Al usar las capacidades existentes del navegador (IE - ContentEditable). Esto permite que el desarrollador permita al usuario editar html directamente. Por lo general, utilizan un iFrame para separar la sección editable del resto de la página, pero esto no es obligatorio.
Luego, el desarrollador puede simplemente leer la fuente html del iframe (o lo que sea) y listo.
Curioso: ¿usan Safari y Chrome una tecnología similar? ¿Hay algo como esto disponible en la mayoría de los navegadores modernos? – hora
Sí y sí: http://operawiki.info/TextAreaEditor No sé cómo se llama para Chrome. –
@Pekka 웃 su enlace está muerto – Volomike