Изменить ввод на верхний регистр без курсора, переходящего к концу текста - PullRequest
0 голосов
/ 21 января 2019

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

<script>
function uppercase(z){
    v = z.value.toUpperCase();
    z.value = v;
}
</script>

<input type="text" id="example" onkeyup="uppercase(this)">

Проблема заключается в том, что когда я набираю что-то в середине текста, курсор переходит на его конец,Выполняя поиск в Google, я попытался найти следующий код, но он совсем не работал:

function uppercase(z){
    document.getElementById(z).addEventListener('input', function (e) {
      var target = e.target, position = target.selectionStart; // Capture initial position
      target.value = target.value.replace(/\s/g, ''); // This triggers the cursor to move.

      v = z.value.toUpperCase();
      z.value = v;

      target.selectionEnd = position; // Set the cursor back to the initial position.
    });
}

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

1 Ответ

0 голосов
/ 21 января 2019

Этого можно добиться, просто добавив немного стилей CSS:

#example {
    text-transform: uppercase;
}

Это приведет к тому, что все буквы в поле ввода будут отображаться в верхнем регистре, но значение будет таким же.Если вам нужно, чтобы значение было в верхнем регистре, преобразуйте его в верхний регистр в тот момент, когда оно вам нужно (например, перед отправкой)

...