Перейти к содержимому

Как запретить ввод цифр js

  • автор:

Курсы javascript

Есть калькулятор с инпутами типа number с step=0.5. Шаг (0,5) запрещает ввод стрелочками чисел типа 7,78 или 4,11175649, но не запрещает их ввод вручную. Как запретить вводить все цифры кроме 5 в качестве первой цифры после запятой?
Спасибо!

21.10.2015, 17:53
Регистрация: 14.01.2015
Сообщений: 12,990

Если шаг 0.5, но ввели к примеру 0.15, то современный браузер все равно не отправит форму, уже при потере фокуса этот элемент будет отображать ошибку в нем.

21.10.2015, 19:49
Новичок на форуме
Регистрация: 08.09.2014
Сообщений: 7

Да, но речь идет о калькуляторе стоимости продукции. Клиент может посчитать, просто для сравнения цен, но не сделать заказ (не отправить форму). А при вводе к примеру 7,3 расчет будет с учетом этого числа. Поэтому лучше запретить ввод подобных чисел. Я в js новичок. Есть идея сделать это через CharCode, только вот как сделать? По идее нужно запретить нажатие цифр после «.» (кроме 5).

21.10.2015, 19:59
Регистрация: 14.01.2015
Сообщений: 12,990

Введите отличное от 0.5 и щелкните вне поля ввода, браузер покажет ошибку. Ну и можно проверять в добавок ввод, чтобы отобразить сообщение.

Если просто запретить без всяких диалогов то просто добавьте полю onkeypress=»return false».

Последний раз редактировалось laimas, 21.10.2015 в 20:11 .
21.10.2015, 23:01
Новичок на форуме
Регистрация: 08.09.2014
Сообщений: 7

Google Chrome Версия 46.0.2490.71 m могу ввести к примеру 7,3 никаких предупреждений не выходит, если перещёлкнуть стрелочкой значение, то оно сменится на ближайшее 7,5 или 7. Хром ругается только при отправки формы, а при вводе молчит.

Курсы javascript

Пересмотрел кучу статей по валидации форм на JS, но нигде не нашел примера кода, который бы полностью блокировал ввод каких-либо символов кроме цифр в форму.

Буду благодарен за пример.

28.09.2017, 18:39
Регистрация: 01.12.2016
Сообщений: 3,650

    Document       

28.09.2017, 18:45
Регистрация: 01.12.2016
Сообщений: 3,650

вот самое простое решение

28.09.2017, 18:48
Регистрация: 01.12.2016
Сообщений: 3,650

Встроенное в инпут

28.09.2017, 19:10
Регистрация: 27.05.2010
Сообщений: 33,009
j0hnik,
лучше с проверкой , чтоб не перезаписывать, если нет \D или это лишнее?
Последний раз редактировалось рони, 28.09.2017 в 19:12 .
28.09.2017, 21:29
Регистрация: 01.12.2016
Сообщений: 3,650
Рони, в целях производительности?
28.09.2017, 21:43
Регистрация: 27.05.2010
Сообщений: 33,009

j0hnik,
да , и курсор как-то вернуть на место после замены, может нужно . но наверно нет смысла, середину числа если неправильно начать вводить курсор скакнёт в конец и что делать с точкой, если потребуется?

Как ограничить ввод данных в текстовое поле

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

Ограничить максимальную длину

Атрибут maxlenght устанавливает максимальное число символов, которое может быть введено пользователем в текстовом поле, работает только c типом text и password .

Тоже самое делает атрибут size , но лучше его не использовать т.к. этот атрибут не работает в Google Chrome.

Как запретить ввод цифр js

Часто возникает задача запрета ввода не цифровых значений в поле . В этом материале разберем реализацию данного механизма на JavaScript.

На мой взгляд, самый простой способ воспользоваться обработчиком события .keydown() — в jQuery или прослушивать событие keydown. Итак, предположим у нас есть текстовое поле с >

Алгоритм проверки будет такой

  1. При нажатии клавиши на клавиатуре ( событие .keydown() ) будем получать keyCode (возвращает код нажатой клавиши) и анализировать его;
  2. Для цифр основной клавиатуры keyCode принимает значения от 48 (клавиша 0) до 57 (клавиша 9);
  3. Для цифр дополнительной клавиатуры ( Num-клавиатуры ) keyCode принимает значения от 96 (клавиша 0) до 105 (клавиша 9);
  4. Так же разрешим:
    • удалять символы ( клавиша Del ) keyCode == 46;
    • переключаться клавишей Tab между полями keyCode == 9;
    • нажимать Backspace keyCode == 8;
    • нажимать Esc keyCode == 27;
    • выделять текст сочетанием Ctrl + A — вот тут клавиша A имеет код keyCode == 65, а событие зажатого Ctrl ctrlKey должно быть строго истина, т.е. получаем условие — ( event.keyCode == 65 && event.ctrlKey === true );
    • разрешим клавишу Home keyCode == 36;
    • разрешим клавишу End keyCode == 35;
    • разрешим клавишу влево keyCode == 37;
    • разрешим клавишу вправо keyCode == 39;

Разрешаем ввод только цифр в поле input на JavaScript

 const input = document.getElementById('only_num'); input.addEventListener('keydown', function(event) < // Разрешаем: backspace, delete, tab и escape if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || // Разрешаем: Ctrl+A (event.keyCode == 65 && event.ctrlKey === true) || // Разрешаем: home, end, влево, вправо (event.keyCode >= 35 && event.keyCode else < // Запрещаем все, кроме цифр на основной клавиатуре, а так же Num-клавиатуре if ((event.keyCode < 48 || event.keyCode >57) && (event.keyCode < 96 || event.keyCode >105 )) < event.preventDefault(); >> >); 

Разрешаем ввод только цифр в поле input на jQuery

 $(document).ready(function() < $("#only_num").keydown(function(event) < // Разрешаем: backspace, delete, tab и escape if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || // Разрешаем: Ctrl+A (event.keyCode == 65 && event.ctrlKey === true) || // Разрешаем: home, end, влево, вправо (event.keyCode >= 35 && event.keyCode else < // Запрещаем все, кроме цифр на основной клавиатуре, а так же Num-клавиатуре if ((event.keyCode < 48 || event.keyCode >57) && (event.keyCode < 96 || event.keyCode >105 )) < event.preventDefault(); >> >); >); 

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *