Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Форматирование текста

Автор: PetrovStas 4.10.2004, 20:02

Имеется html-код:

Код

<INPUT id='btnBold' name='btnBold' type='button' value='Полужирный' onClick='f_format("Bold");' class='btnUp'>
<DIV id='editor' name='editor' contenteditable ></DIV>

С помощью JavaScript обрабатываем нажатие кнопки:

Код

// производим форматирование текста согласно пришедшего параметра
function f_format(cmd) {
    document.execCommand(cmd);
    editor.focus();
};

Необходимо сделать так чтобы при установке курсора в тексте (элемент DIV) на символы имеющие
различное форматирование (полужирный, курсив и т.д.) изменялся стиль кнопки на btnDown

Помогите пожалуйста!

Автор: Aliance 4.10.2004, 21:17

Можто так:

Код


function f_format(cmd) {
   document.execCommand(cmd);
   editor.focus();
   document.getElementById("btnBold").className = "Нужный_тебе_класс"
};

Автор: Alx 5.10.2004, 16:09

не очень понятен вопрос. Объясни поподробнее!

Автор: PetrovStas 5.10.2004, 17:16

Поясняю:
Необходимо при нажатии на кнопку заменить текст на жирный(как в word'е) и наоборот при выделении слова отображать кнопку нажатой.

Автор: Alx 5.10.2004, 17:22

при выделении слова отображать кнопку нажатой.

т.е. если курсор стоит на "жирном" слове, то кнопка нажата, а value "полужирный", так?
если курсор стоит на "курсиве", то кнопка нажата, а value "Наклонный".
Сколько всего вариантов форматирования. 3? B, I и U? При наведении на не форматированный текст, какой должна быть кнопка и Value?

Автор: Aliance 5.10.2004, 19:36

Тогда так:

Код


function changeClass() {
      var button = document.getElementById("btnBold");
    evt = (evt) ? evt : ((window.event) ? event : null);
    if (evt) {
       var elem = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
         if (elem == button && elem.type == click) {
         document.getElementById("btnBold").value = "Нужное_тебе_value"
         }
   }
}

Автор: Sardar 6.10.2004, 00:58

Aliance evt в аргументах забыл

PetrovStas не видя всего кода сложно ответить кодом

По моему код позаимствован из яндекса.
Текст фоматируется обычными HTML тегами, браузер сам вставляет нужную разметку при печати. Проверяем если мы сейчас в теге <b></b>, то ставим кнопку нажатой.

Досконально этим вопросом не занимался, нужно почитать пару статей на MSDN'е и разобрать исходники HTMLArea. Xороший вопрос

Автор: Aliance 6.10.2004, 13:39

Sardar
Точно, пасип

[offtop]Вчера с коньяком я перебрал, наверное %)[/offtop]