Так называемый ввод текстового поля Flashback означает, что фокус блока ввода всегда находится в начале. Как показано на рисунке, когда я ввожу 123456789, 987654321 отображается на поле ввода.
Почему вы хотите сделать эту демонстрацию? Это потому, что я столкнулся с этим в проекте. Требования к проекту представляют собой два ящика ввода, одно вводится в положительном порядке, а другой вводится в воспоминания. Ниже я запишу идеи и код реализации.
Ввод текстового воспоминания:
Пока мы гарантируем, что в первую очередь основное внимание находится в вводе, мы можем достичь этого каждый раз, когда вводим его, то есть рецидив.
Код:
function setPosition (ctrl, pos) {// Установить функцию позиции курсора if (ctrl.setselectionrange) {ctrl.focus (); ctrl.setselectionrange (pos, pos);} else if (ctrl.createTextrange) {var anrage = ctrl.creatextrange (); // Создать диапазон площади выбора. Collapse (true); // переместить курсор в исходное положение диапазона площади выбора. Moveend ('символ', pos); // Измените положение, в котором площадь выбора заканчивается диапазон. // Измените позицию, в которой площадь выбора запускается диапазон. Select (); // синхронизировать выбранное содержимое с текущим объектом}}Пока мы устанавливаем параметр POS на 0, все будет хорошо.
Ниже приведена полная демонстрация, которая реализует нормальное удаление и вход воспоминаний.
<! Doctype html> <html> <head> <title> </title> <meta http-equiv = "content-type" content = "text/html; charset = utf-8">. {width: 200px;} </style> <script src = "http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.min.js"> </script> </head> <body> <div style = "> <ul> <li> <pint =" type = "text"> </li> <li> <input type = "text"> </li> </ul> </div> <script> function setPosition (ctrl, pos) {// Установить функцию положения курсора if (ctrl.setselectionrangerange) {ctrl.focus (); {var range = ctrl.createTexTrange (); // Создать диапазон площади выбора. Collapse (true); // переместить курсор в исходное положение диапазона площади выбора. Moveend ('символ', pos); // Изменить конечную позицию диапазона площади выбора. Movestart ('символ', pos); // Измените исходное положение диапазона площади выбора. Select (); // Синхронизируйте выбранное содержание с текущим объектом}} $ ('. Elem'). On ('keypress keyup', function () {if (event.keycode === 8) return; setPosition (this, 0);}); </script> </body> </html>Кроме того, вы можете использовать соответствующую функцию для получения позиции фокусировки.
function getPosition (ctrl) {// ie supportvar caretpos = 0; if (document.selection) {ctrl.focus (); var sel = document.selection.createrange (); sel.movestart ('символ', -ctrl.value.length); caretpos = sel.text.length;} // firefox поддерживает if (ctrl.selectionStart | ctrl.selectionStart; return (caretpos);}Суммировать:
Установив и получив фокус ввода текста, мы можем сделать некоторые другие спецэффекты, такие как удаление всего слова или переменной и т. Д.
Если у вас есть хорошие идеи об этой статье, вы можете @me, я надеюсь, что эта статья может вам помочь!