Есть ли способ вернуть курсор в начало текстового поля, когда оно теряет фокус?

Question

В моей форме есть несколько текстовых полей ввода [type = "text"], которые иногда недостаточно широки для содержимого, вводимого в них.

В настоящее время, если пользователь вводит больше текста, который подходит (но меньше максимальной длины), текстовое поле прокручивается так, как вы ожидаете. Когда они выходят из текстового поля, текстовое поле остается прокрученным до «конца» того, что они ввели.

Я пытаюсь найти способ вернуть текстовое поле в начало, когда пользователь выходит из поля.

Я посмотрел на предложение здесь:

Установка положения курсора клавиатуры в текстовом поле html

... но это не работает в событии onblur, потому что решение фактически заставляет текстовое поле снова быстро сфокусироваться перед тем, как снова вспыхнуть, что вызывает бесконечный цикл.

Прежде чем я сдаюсь, есть ли у кого-нибудь решение переустановить курсор в начало текстового поля в событии onblur?

Answer 1

В Internet Explorer вы можете установить свойство scrollLeft. Это не работает в Firefox, но если вы сбросите значение на себя, оно будет прокручиваться обратно к началу. Видимо, любой метод работает в Chrome. На данный момент у меня нет других браузеров для тестирования.

$("input[type=text]").blur(function() {
    this.value = this.value; // Firefox
    this.scrollLeft = 0; // Internet Explorer
});

Я использовал jQuery, потому что это то, к чему я привык, но вы можете адаптировать его под любой фреймворк / метод, который вы используете для событий.