Вот некоторые фрагменты кода и примеры того, как использовать jQuery и HTML5 для установки фокуса ввода курсора и позиций курсора, которые являются общими действиями с формами входа в систему и т.п. Комментарии, улучшения и предложения приветствуются.
Фокус ввода jQuery
Просто вызовите функцию focus (), чтобы установить фокус на вход.
//set focus on input
$('input[name=firstName]').focus();
Фокус ввода HTML5
Отличная функция, предоставляемая HTML5… Не удалось найти ее на http://html5please.com/, но я протестировал, что она работает в Chrome и Firefox, но не в IE9 или ниже.
//AUTO INPUT FOCUS
<input type="text" name="myInput" autofocus />
jQuery Установить положение курсора
Функция jQuery для установки позиции курсора на специфическую позицию символа в поле ввода.
//SET CURSOR POSITION
$.fn.setCursorPosition = function(pos) {
this.each(function(index, elem) {
if (elem.setSelectionRange) {
elem.setSelectionRange(pos, pos);
} else if (elem.createTextRange) {
var range = elem.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
});
return this;
};
Пример использования
Устанавливает позицию курсора после первого символа.
$('#username').setCursorPosition(1);
jQuery Установить положение курсора
Функция jQuery для автоматического выбора текста (определенного количества символов) в поле ввода.
//SELECT TEXT RANGE
$.fn.selectRange = function(start, end) {
return this.each(function() {
if (this.setSelectionRange) {
this.focus();
this.setSelectionRange(start, end);
} else if (this.createTextRange) {
var range = this.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', start);
range.select();
}
});
};
Пример использования
Выбирает первые 5 символов на входе.
$('#username').selectRange(0,5);