Mi chiedevo come mantenere la formattazione online rich text editors quando si incolla del testo da una pagina Web o un documento. Una casella textarea standard prende il testo solo mentre questi editor WYSIWYG sembrano utilizzare un DIV. Come funziona?Come funzionano gli editor di testo in linea?
risposta
Gli editor di testo in linea utilizzano contentEditable o designMode per sfruttare il supporto nativo del browser per l'editing HTML. Quando si incolla l'elemento contentEditable o designMode, il browser inserisce l'HTML direttamente nell'elemento. Provalo da solo incollando Midas Demo e quindi utilizzando l'elemento inspect di Firebug per esaminare l'HTML incollato.
Le applicazioni JavaScript possono utilizzare il metodo execCommand per formattare la selezione dell'utente in un editor di testo RTF.
WYSIWYG Gli editor in realtà si basano su funzionalità di modifica HTML di base che i browser hanno già integrato. In Firefox, la tecnologia è chiamata Midas. In IE, contentEditable.
Utilizzando le funzionalità del browser esistente (IE - ContentEditable). Ciò consente allo sviluppatore di consentire all'utente di modificare direttamente html. Di solito usano un iFrame per separare la sezione modificabile dal resto della pagina, ma questo non è richiesto.
Quindi lo sviluppatore può semplicemente leggere il codice html dell'iframe (o qualsiasi altra cosa) e il gioco è fatto.
Curioso: Safari e Chrome utilizzano tecnologie simili? È qualcosa di simile disponibile nella maggior parte dei browser moderni? – hora
Sì e sì: http://operawiki.info/TextAreaEditor Non so come si chiama Chrome. –
@Pekka 웃 il tuo link è morto – Volomike