Validate Year
Allow only delete, backspace,left arrow,right arrow, Tab and numbers on an input.
HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div id="container">
<header></header>
<div id="main" role="main">
Input a 4-digit year: <input type="tel" class="validateYearTextBox" />
</div>
<footer></footer>
</div>
</body>
</html>
JavaScript
function checkValidInput() {
$(".validateYearTextBox").keydown(function(event) {
// Allow only delete, backspace,left arrow,right arrow, Tab and numbers
if (!((event.keyCode == 46 ||
event.keyCode == 8 ||
event.keyCode == 37 ||
event.keyCode == 39 ||
event.keyCode == 9) ||
$(this).val().length < 4 &&
((event.keyCode >= 48 && event.keyCode <= 57) ||
(event.keyCode >= 96 && event.keyCode <= 105)))) {
// Stop the event
event.preventDefault();
return false;
}
});
}
$(document).ready(function() {
checkValidInput();
});