Как можно написать простой редактор WYSIWYG на JavaScript?

Question

В моем проекте мне нужно написать небольшой редактор WYSIWYG (просто позвольте пользователям выделять текст жирным шрифтом / курсивом / подчеркиванием и, возможно, еще немного) Поэтому я не хотел бы использовать монстров, таких как tinymce или fckeditor. У меня вопрос, какие элементы HTML и функции javascript мне нужно знать для этого? Элемент HTML, в котором я могу редактировать и форматировать текст, очень интересен в этом вопросе.

Answer 1

Если вы хотите свернуть свои собственные, посмотрите на Midas . Он доступен в FF3 +, IE, Safari, Opera, Chrome.

Обычно вы используете contentEditable и execCommand, чтобы превратить браузер в RTE.

Answer 2

document.getElementById('edit').contentDocument.designMode = "on";

Посмотрите на http://www.mozilla.org/editor/ie2midas.html

Answer 3

Существует http://www.gosu.pl/steditor/, код которого довольно прост и понятен. Он использует designMode и execCommand, как упоминалось в других ответах.

Answer 4

В качестве альтернативы используйте простые языки, такие как разметка или текстиль, и предоставьте предварительный просмотр в реальном времени.

Я думаю, что большинство людей получат звездочки для акцента и двойные для жирного шрифта .

Answer 5

Я использовал редактор wysiwyg YUI в прошлом, и он позволяет вам настраивать кнопки так, чтобы их можно было легко использовать, и ограничить кнопки полужирным / курсивом / подчеркиванием.