Часто возникает задача запрета ввода не цифровых значений в поле <input>. В этом материале разберем реализацию данного механизма на JavaScript.
На мой взгляд, самый простой способ воспользоваться обработчиком события .keydown() - в jQuery или прослушивать событие keydown. Итак, предположим у нас есть текстовое поле с id = «only_num».
<input type="text" id="only_num" value="" />
Последние четыре требования можно объединить в одно — ( event.keyCode >= 35 && event.keyCode <= 39 ), правда в этом случае мы разрешаем еще нажатие клавиши вверх keyCode == 38, но, думаю это не критично, а код получится красивее.
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 <= 39)) {
// Ничего не делаем
return;
} else {
// Запрещаем все, кроме цифр на основной клавиатуре, а так же Num-клавиатуре
if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
event.preventDefault();
}
}
});
$(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 <= 39)) {
// Ничего не делаем
return;
} else {
// Запрещаем все, кроме цифр на основной клавиатуре, а так же Num-клавиатуре
if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105 )) {
event.preventDefault();
}
}
});
});
В этой статье вы простым языком поймете работу с каррированием в JavaScript и увидите рабочие примеры его применения
Благодаря тегу audio появившемуся в HTML5, можно очень просто добавлять звук на сайт. В javascript работать со звуком позволяет соответствующий класс Audio, а проверить поддержку формата звукового файла в браузере - метод canPlayType
Ключевое слово this в JavaScript, так же, как и во многих других языках программирования, используется подобно местоимению в естественном языке. Так же, как в естественном языке, с помощью местоимений мы указываем на определенного человека, животное, предмет, в JavaScript мы можем использовать this для указания на определенный объект.