Как вызывать ф-цию, используя разные события, на жирном тексте?

Question

[4eloBek]

Например при клике на жирном тексте (т.е. на том, который обрамлен <b></b> тегами) это работает:

$('#content').on('click', 'b', function() {  alert("Вы кликнули на жирном тексте")  });

С остальными событиями, которые мне нужны - select, keydown - такое не катит(
Подскажите, пожалуйста, что не так)

Comments

[Anton Filippov]

а как вы представляете себе кейдаун на жирном тексте?)

[4eloBek]

Антон Ф.: <div id="content" contenteditable="true" ></div>

[Anton Filippov]

4eloBek: ничоси

[4eloBek]

Антон Ф.: т.е. если я, к примеру, буду двигать курсор "стрелочками" и он вдруг попадет в зону <b></b>, то должен произойти вызов ф-ции. Вот)

Answer 1

[Мак Алексей]

The select event is sent to an element when the user makes a text selection inside it. This event is limited to <input type="text"> fields and <textarea> boxes.

The keyup event is sent to an element when the user releases a key on the keyboard. It can be attached to any element, but the event is only sent to the element that has the focus. Focusable elements can vary between browsers, but form elements can always get focus so are reasonable candidates for this event type.

Так что проблема в том, что event не генерируется в принципе и тут Вы ничего не поделаете.

Comments

[4eloBek]

А можно тогда как-то по позиции каретки определять жирный ли это текст или нет?

[Мак Алексей]

Можно генерировать евент и смотреть event.target. например на keyup. Но select надо будет делать ручками. Причем, обработка выделения с шифтом назад зачастую не работает.

[4eloBek]

Мак Алексей: keyup: основной DIV видит, а внутри элементы - нет.
click: все отлично как всегда)

Вот пример на jsfiddle.net

[Мак Алексей]

jsfiddle.net/aBYpt/14 Если найдёте более элегантное решение - пишите.

[4eloBek]

Мак Алексей: Эх. Для wysiwyg'a это хард)

Answer 2

[Алексей]

$('#content b').live('click', function() { alert("Вы кликнули на жирном тексте") });

Comments

[4eloBek]

не работает...

[Мак Алексей]

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().

Answer 3

[Сергей Соколов]

Интересный вопрос. Не полное решение, но поможет найти: Fiddle, где опеределяют позицию курсора в редактируемом элементе с html тегами.