tinymce: режим форматированного текста, как он работает - PullRequest
Новая
       29

tinymce: режим форматированного текста, как он работает

9 голосов
/ 16 октября 2010

Я хочу понять, как работает tinymce.

Редактор форматированного текста содержит HTML-документ внутри iframe. как вложенные элементы DOM внутри доступны для редактирования, другими словами, как я могу печатать внутри слоя <div> или <p>, когда нет текстовой области или поля ввода (по крайней мере, я его не вижу)?

элементы преобразуются в поля ввода, когда они активны?


edit: Если вы собираетесь проголосовать за вопрос, укажите причину.

1 Ответ

11 голосов
/ 16 октября 2010

В случае с tinyMCE (и большинством других редакторов) это <iframe> (чтобы не наследовать стили от родительской страницы, среди прочих причин), но магия заключается в установке атрибута contentEditable до true.

Подробнее о рабочем проекте HTML5 вы можете прочитать здесь .

Вы можете протестировать очень упрощенную демонстрацию здесь , редакторы, конечно, делают гораздо больше со своими панелями инструментов, поддержкой <textarea> для хранения разметки для отправки на сервер и т. Д. ... но ваш вопрос кажется, как вы редактируете элементы, ядро ​​которых contenteditable.

...