Ответ 1

Согласно WHATWG, вы не сможете получить значение, если оно не является допустимым числовым вводом. Алгоритм дезинфекции поля ввода указывает, что браузер должен установить значение в пустую строку, если вход не является допустимым числом с плавающей запятой.

алгоритм дезактивации стоимости выглядит следующим образом: Если valueэлемент не является действительным числом с плавающей запятой, а затем устанавливает его в пустой строка вместо.

Указывая тип (<input type="number">), вы просите браузер выполнить некоторую работу за вас. Если, с другой стороны, вы хотели бы иметь возможность фиксировать нечисловый ввод и что-то делать с ним, вам придется полагаться на старый проверенный и верный текстовый ввод и самостоятельно анализировать содержимое.

W3 также имеет те же спецификации и добавляет:

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

Ответ 2

Он не отвечает на вопрос, но полезным решением является проверка

edQuantity.validity.valid

ValidityState объекта дает информацию о том, что пользователь вводил. Рассмотрим вход type="number" с параметрами min и max

<input type="number" min="1" max="10">

Мы всегда хотим использовать .validity.valid.

Другие свойства предоставляют только бонусную информацию:

Users Input   .value  .valid | .badInput  .rangeUnderflow  .rangeOverflow
============  ======  ====== | =========  ===============  ==============
""            ""      true   | false      false            false  ;valid because field not marked required
"1"           "1"     true   | false      false            false  
"10"          "10"    true   | false      false            false
"0"           "0"     false  | false      true             false  ;invalid because below min
"11"          "11"    false  | false      false            true   ;invalid because above max
"q"           ""      false  | true       false            false  ;invalid because not number
"³"           ""      false  | true       false            false  ;superscript digit 3
"٣"           ""      false  | true       false            false  ;arabic digit 3
"₃"           ""      false  | true       false            false  ;subscript digit 3

Вам необходимо убедиться, что браузер поддерживает проверку HTML5 перед его использованием:

function ValidateElementAsNumber(element)
{
   if ((element.validity) && (!element.validity.valid))
   {
      //if html5 validation says it bad: it bad
      return false;
   }

   //Fallback to browsers that don't yet support html5 input validation
   //Or we maybe want to perform additional validations
   var value = StrToInt(element.value);
   if (value != null)
      return true;
   else
      return false;
}

Bonus

У Spudly есть полезный ответ, который он удалил:

Просто используйте селектор CSS :invalid для этого.

input[type=number]:invalid {
    background-color: #FFCCCC;
}

Это приведет к тому, что ваш элемент станет красным, если нечисловой Действителен.

Поддержка браузера для <input type='number'> примерно такая же, как :invalid, поэтому проблем нет.

Подробнее о :invalidздесь.

Примечание. Любой код выпущен в общедоступном домене. Не требуется атрибуция.

Ответ 3

input.focus();
document.execCommand("SelectAll");
var displayValue = window.getSelection().toString();

Ответ 4

Отслеживать все нажатые клавиши на основе их кодов клавиш

Я предполагаю, что можно прослушать события keyup и сохранить массив всех введенных символов на основе их кодов клавиш. Но это довольно утомительная задача и, вероятно, склонна к ошибкам.

http://unixpapa.com/js/key.html

Выберите вход и выберите выделение в виде строки

input.select(); 
var value = window.getSelection().toString();

Все кредиты: int32_t