Вставка тегов (WYSIWYG JavaScript editor)

Question

В настоящее время я работаю над редактором WYSIWYG для клиента (он не похож ни на один другой редактор, он также сможет вставлять рисунки с использованием HTML5). И я смотрел и использовал несколько способов вставки содержимого.

Итак, у меня есть div с contentEditable установленным значением «true», и я застрял на пути, делая текст разного размера/шрифта, вставляя теги до и после курсора или что-то подобное. Я пробовал использовать режим разработки с помощью execcommand, но это не сработало. Может ли кто-нибудь помочь?

Answer 1

У вас есть чтение, чтобы сделать. Если вы это понимаете, имейте в виду, что сложная и трудоемкая задача заключается в написании редактора WYSIWYG в JavaScript: есть много ошибок, причуд и расхождений между браузерами и тот факт, что вы здесь задаете такой общий вопрос на переполнении стека на этом этапе не сулит ничего хорошего. Большинство разработчиков браузеров имеют легко найденную документацию по их реализациям designMode и contenteditable (см., Например, MDC), чтобы вы могли начать работу там. Чтобы сделать что-то вроде вставки элемента в курсор, вам также нужно научиться иметь дело с Selections, DOM Level 2 Ranges и TextRanges в IE до версии 8. Наконец, глядя на исходный код некоторых популярных редакторов, таких как TinyMCE и CKEditor может помочь; более простые, меньшие редакторы (есть нагрузки вокруг) могут быть еще более полезными.