Как узнать положение курсора в div'e с contentEditable="true"?
Здравствуйте! Обычно для ввода/изменения текста используются textarea и input. В моём случае я использую див с contentEditable="true". Поэтому здесь не подходят функции для определения позиции курсора в textarea и input. Сама задача: мне нужно узнать позицию курсора в этом диве, после чего получить эту позицию, и вставить туда кусок текста, который будет добавляться при клике на другой див. Для начала хочу узнать, как определить и получить позицию курсора в div'e с contentEditable="true"?
Подскажите, пожалуйста.
Я не могу правильно прикрепить к своему html коду. Вставка идёт в начало строки. Если у Вас есть скайп, то не могли бы Вы, пожалуйста, мне помочь прикрепить правильно?
@Petroveg Я сейчас Ваш код подправил. Примерно так у меня сейчас выглядит. Чтобы Вы поняли, как у меня устроена часть кода. При таком решении текст вставляется в самое начало. Не могли бы Вы, пожалуйста, подредактировать текущий код, чтобы корректно работало?
@Yadalay добавлю, что вы могли бы использовать и ссылки — для работы по описанному сценарию без лишних шагов по нахождению позиции и её сохранении, а потом принудительной постановки курсора (а так тоже можно).
Почему можно ссылки? Они могут получать фокус:) А span не может, увы.
@Petroveg Извините, что опять отвлекаю Вас, но у меня возник ещё один вопрос. Вот при нажатии на кнопку вставляется такой текст: "" (без кавычек). Вопрос: как сделать так, чтобы после вставки курсор был между тегами?
@Yadalay
Чтобы вставить тэг, нужно писать &lt; и >, тогда получится, к примеру, <b>жырное</b>.
По теме — есть же описание и Selection, и Range.
Нужно делать collapse(). В какой ноде? Я не большой знаток Range и Selection. Вот достаточно тупой вариант для всех, кроме IE 8 jsfiddle.net/petroveg/Lnm256qc/20
Я создал пустую текстовую ноду и потом свернул в ней выделение. Глкпо, но работает:)
@Yadalay ну у вас же ссылки есть, ищите самостоятельно решение — то ли текстовую ноду вставлять, то ли выделить и схлопывать:) Тем более для IE 8 ещё нужно.
@Petroveg Решил эту проблему. При клике добавил такой код:
var number = tag.indexOf('>')+1;
insertHTML(chars(tag), number);
Где number - номер позиции символа ">". "+1" делаю для того, что курсор был после этого символа. В самой функции вместо 0 пишу number.
