У меня есть текстовая область и кнопка на форме. В текстовом поле уже есть текст. Я бы хотел, чтобы курсор переместился в последнюю позицию в текстовой области при нажатии кнопки.
Возможно ли это?
У меня есть текстовая область и кнопка на форме. В текстовом поле уже есть текст. Я бы хотел, чтобы курсор переместился в последнюю позицию в текстовой области при нажатии кнопки.
Возможно ли это?
Под "последней позицией", вы имеете в виду конец текста?
Изменение значения .value поля формы переместит курсор в конец в каждом браузере, кроме IE. В IE вы должны грязно и сознательно манипулировать выбором, используя нестандартные интерфейсы:
if (browserIsIE) {
var range= element.createTextRange();
range.collapse(false);
range.select();
} else {
element.focus();
var v= element.value();
element.value= '';
element.value= v;
}
Или вы хотите вернуть курсор обратно в место, которое было ранее, в последний раз, когда текстовая область была сфокусирована?
В каждом браузере, кроме IE, это уже произойдет, вызвав 'element.focus(); браузер запоминает последнюю позицию курсора/выбора на каждый вход и помещает ее обратно в фокус.
Это было бы довольно сложно воспроизвести в IE. Вам нужно будет все время проверять, где находится курсор/выбор, и запомнить эту позицию, если она была во входном элементе, а затем выбрать позицию для данного элемента при нажатии кнопки и ее восстановлении. Это связано с некоторыми довольно утомительными манипуляциями с document.selection.createRange().
Я ничего не знаю о jQuery, который поможет вам в этом, но возможно, где-то может быть плагин?
xgMz ответ был лучшим для меня. Вам не нужно беспокоиться о браузере:
var html = $("#MyTextArea").val();
$("#MyTextArea").focus().val("").val(html);
И вот быстрое расширение jQuery, которое я написал для этого в следующий раз:
; (function($) {
$.fn.focusToEnd = function() {
return this.each(function() {
var v = $(this).val();
$(this).focus().val("").val(v);
});
};
})(jQuery);
Используйте это:
$("#MyTextArea").focusToEnd();
Вы также можете сделать это:
$(document).ready(function()
{
var el = $("#myInput").get(0);
var elemLen = el.value.length;
el.selectionStart = elemLen;
el.selectionEnd = elemLen;
el.focus();
});
Этот код работает как для input
, так и для textarea
. Протестировано с последними браузерами: Firefox 23, IE 11 и Chrome 28.
jsFiddle
можно найти здесь: http://jsfiddle.net/cG9gN/1/
Источник: fooobar.com/questions/166804/...
Вы можете использовать этот https://github.com/DrPheltRight/jquery-caret
$('input').caretToEnd();
Это то, что я использую для текстовых полей внутри своих onclick или других событий и, кажется, отлично работает для FireFox и IE 7 и 8. Он позиционирует курсор в конце текста вместо фронта.
this.value = "some text I want to pre-populate";
this.blur();
this.focus();
Чтобы установить фокус мыши и переместить курсор на конец ввода. Его работа в каждом браузере, его простая логика здесь.
input.focus();
tmpStr = input.val();
input.val('');
input.val(tmpStr);
Я немного модифицировал расширение @mkaj для поддержки значения по умолчанию
; (function($) {
$.fn.focusToEnd = function(defaultValue) {
return this.each(function() {
var prevValue = $(this).val();
if (typeof prevValue == undefined || prevValue == "") {
prevValue = defaultValue;
}
$(this).focus().val("").val(prevValue);
});
};
})(jQuery);
// See it in action here
$(element).focusToEnd("Cursor will be at my tail...");