Была идея, и теперь я пытаюсь воплотить ее в жизнь.
Идея: иметь HTML-страницу с несколькими входами с CSS, чтобы она выглядела как разлинованная бумага. Затем в конце каждой строки переместите фокус с одного входа на другой, чтобы пользователь мог продолжить ввод на странице, имитирующей подкладочную бумагу.
Проблема: нет способа обнаружить или зафиксировать событие, когда вход достигает конца строки, и, следовательно, нет способа переместить фокус с одного поля на другое.
Я попытался использовать атрибут maxlength на входах, но это не сработало, потому что, конечно, некоторые буквы шире других, поэтому строки никогда не «заполнялись»
Возможное решение: изменить входные данные на div с внутренним интервалом, заключающим текст, вычислить ширину span для события keyup и сопоставить ее с общей шириной div, если она больше, чем работа по обрезке текста и перемещению текста и фокусировки следующий див.
Проблема в том, что это может быть грязно и может привести к снижению производительности на странице в зависимости от количества строк, которые я решу использовать.
Вопрос: Есть ли какое-либо событие, которое я могу извлечь из ввода, когда достигнут конец видимой области, чтобы можно было запустить мою функцию ?? Или, может быть, кто-то может иметь лучшее представление о том, как это реализовать? ИЛИ я пытаюсь воссоздать колесо, и что-то для этого уже написано (я ничего не смог найти в Google) ??