Выделить весь текст в INPUT = TEXT

Question

Следующий код делает это: когда пользователь нажимает [Enter], он переходит / переключается на следующий TEXTBOX.

$(function () {
    $('input:text:first').focus();
    var $inp = $('input:text');
    $inp.bind('keydown', function (e) {
        //var key = (e.keyCode ? e.keyCode : e.charCode);
        var key = e.which;
        if (key == 13) {
            e.preventDefault();
            var nxtIdx = $inp.index(this) + 1;
            var nextTextBox = $(":input:text:eq(" + nxtIdx + ")");
            nextTextBox.focus();
        }
    });
});

Над кодом работает нормально.

но, что я хочу сделать дальше, это автоматически выделить весь текст в текстовом поле. Вот что я делаю:

$(function () {
    $('input:text:first').focus();
    var $inp = $('input:text');
    $inp.bind('keydown', function (e) {
        //var key = (e.keyCode ? e.keyCode : e.charCode);
        var key = e.which;
        if (key == 13) {
            e.preventDefault();
            var nxtIdx = $inp.index(this) + 1;
            var nextTextBox = $(":input:text:eq(" + nxtIdx + ")");
            nextTextBox.focus();
            nextTextBox.setSelectionRange(0, nextTextBox.value.length);
        }
    });
});

но это не работает. Знаете ли вы, как исправить код для автоматического выделения всего текста после перехода к следующему текстовому полю?

Answer 1

$(":input:text:eq(" + nxtIdx + ")") 

этот селектор возвращает массив, так что вы можете использовать индексирование [0] или использовать val () для получения значения, которое вернет первый элемент, соответствующий селектору.

Вы можете использовать $(":input:text:eq(" + nxtIdx + ")")[0] или $(":input:text:eq(" + nxtIdx + ")").val()

$(function() {
  $('input:text:first').focus();
  var $inp = $('input:text');
  $inp.bind('keydown', function(e) {
    var key = e.which;
    if (key == 13) {
      e.preventDefault();
      var nxtIdx = $inp.index(this) + 1;
      if ($(":input:text:eq(" + nxtIdx + ")").length > 0) {
        $(":input:text:eq(" + nxtIdx + ")").focus();
        $(":input:text:eq(" + nxtIdx + ")")[0].setSelectionRange(0, $(":input:text:eq(" + nxtIdx + ")")[0].value.length)
      }
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input />
<input />