Как в html input запретить ввод любых символов кроме 0 и положительных чисел

Для ограничения ввода в HTML <input> так, чтобы разрешены были только цифры (0 и положительные числа), можно использовать несколько подходов.

1. Использование атрибута type="number"

HTML предоставляет встроенный тип для чисел:

<input type="number" min="0" oninput="validity.valid || (value='');" />

• Атрибут min="0" запрещает ввод отрицательных чисел.
• Событие oninput сбрасывает поле, если введены недопустимые символы (например, буквы).

Недостаток: пользователи могут обойти это ограничение через инструменты разработчика.

2. Добавление ограничения с помощью pattern (регулярное выражение)

Можно использовать атрибут pattern:

<input type="text" pattern="^[0-9]*$" title="Введите только положительное число или 0" />

• pattern="^[0-9]*$" разрешает только цифры (0–9).
• title отображает подсказку, если пользователь вводит недопустимые символы.

3. JavaScript для динамической валидации

Если нужно более строгий контроль (например, предотвращение ввода недопустимых символов), используйте JavaScript:

<input type="text" id="numberInput" />

<script>
  const input = document.getElementById('numberInput');

  input.addEventListener('input', () => {
    input.value = input.value.replace(/[^0-9]/g, ''); // Удаляет всё, кроме цифр
  });
</script>

4. Совмещение методов

Вы можете комбинировать вышеуказанные методы для усиления ограничения:

<input 
  type="text" 
  pattern="^[0-9]*$" 
  title="Введите только положительное число или 0" 
  oninput="this.value = this.value.replace(/[^0-9]/g, '');"
/>

Наиболее универсальный и надежный способ — сочетать атрибуты pattern или type="number" с JavaScript для динамической обработки ввода.