Mobile Number Validation (IE10+)
by codef0rmer
HTML
<input id="tel" type="tel" />
CSS
input {
width: 200px;
height: 30px;
border: 2px solid black;
}
JavaScript
var $tel = $('#tel');
var EXTRACT_NUMERIC_REGEXP = /\d+/g;
var IS_NONNUMERIC_REGEXP = /\D+/ig;
var oldVal = '';
var newVal = '';
$tel.on('input', listener);
$tel.on('keydown', function(event) {
var key = event.keyCode;
// ignore command modifiers arrows
if (key === 91 || (15 < key && key < 19) || (37 <= key && key <= 40)) return;
listener(event)
});
$tel.on('keypress', listener);
$tel.on('change', listener);
$tel.on('paste cut', listener);
function listener(event) {
oldVal = newVal;
newVal = event.target.value || '';
if (oldVal === newVal || !IS_NONNUMERIC_REGEXP.test(newVal)) {
if (IS_NONNUMERIC_REGEXP.test(newVal)) {
event.target.value = !!newVal.match(EXTRACT_NUMERIC_REGEXP) && newVal.match(EXTRACT_NUMERIC_REGEXP).join('') || '';
newVal = event.target.value || '';
}
return;
} else {
event.target.value = !!newVal.match(EXTRACT_NUMERIC_REGEXP) && newVal.match(EXTRACT_NUMERIC_REGEXP).join('') || '';
newVal = event.target.value || '';
}
}