Целочисленный числовой вход только на мобильных устройствах

Question

Я использую <input type='text' onkeypress='return isNumberKey(event)'>
Я пробовал <input type='number'>, но это позволяет людям использовать период и 'e'. Я хочу, чтобы людям разрешалось использовать только неотрицательные целые числа.

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

function isNumberKey(evt) { 
    var charCode = (evt.which) ? evt.which : event.keyCode; 
    if (charCode != 8 && (charCode < 48 || charCode > 57)) 
     return false; 

    return true; 
}; 

Answer 1

Вы можете использовать pattern атрибут с RegExp\D, input событие, RegExp.prototype.test(), String.prototype.slice() с параметром 0, -1 для удаления последнего входного значения, если не цифра, которая соответствует RegExp в pattern атрибуте

var input = document.querySelector("input"); 
 
function handleInput(event) { 
 
    var value = this.value; 
 
    if (new RegExp(this.pattern).test(value)) { 
 
    this.value = value.slice(0, -1) 
 
    } 
 
} 
 
input.addEventListener("input", handleInput);

<input type="text" pattern="\D" />