Есть textarea. Есть его содержимое и номера строк слева. По нажатию на номер строки надо подсветить всю строку. Строки определяются не по переносам, а по высоте. В целом всё уже готово:
Проблема вот в чем: реализовано это через div который через position:absolute перекрывает поле ввода. А значит, что в этом месте вводить и редактировать текст не получится. Было бы проще, если бы надо было подсветить текст по переводам строки(\n) - тогда можно использовать кое-какой jquery плагин который подсвечивает текст в поле ввода от и до обозначенных символов. Но заказчик хочет именно так как на скриншоте, а в таком случае становится проблематично узнать, в каком месте какой по порядку символ находится, даже с моноширинным шрифтом.
Пробовал ловить события клика и другие события на элементе div и пробрасывать в textarea через new Event с последующим elem.dispatchEvent(event); - ноль реакции. Поле ввода ловит все события но ничего не происходит, курсор не устанавливается в текст.
Что делать? Может есть другой путь подсветки строки?
Свиду вопрос простой, но сижу уже пятый день над ним. За несколько лет опыта многое повидал и сделал но такую простую фишку реализовать не получается.
Простой
Простой
Простой