Sergey_Koval,
вариант
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.error{
display: none;
color: #FF3300;
margin: 0 5px;
}
</style>
</head>
<body>
<form action="http://javascript.ru/forum/" class="form">
<input size="21" class="tel"><p class="error"></p>
<input type="submit" value=" OK ">
</form>
<script>
var tel = document.querySelector('.tel'),
err = document.querySelector(".error"),
form = document.querySelector(".form");
function setCursorPosition(pos, elem) {
elem.focus();
elem.setSelectionRange(pos, pos);
}
function proverka(el) {
err.style.display = "none";
var matrix = "+7 ( 456 ) 999 - 99 - 99",
i = 0,
val = el.value.replace(/\D/g, '');
val.length < 4 && (val = "7456");
matrix = matrix.replace(/\d/g, function(a) {
return val.charAt(i++) || "_"
});
el.value = matrix;
i = matrix.lastIndexOf(val.substr(-1));
i < matrix.length && i > 7 ? i++ : (i = 11)
setCursorPosition(i, el)
return i == matrix.length
};
tel.oninput = tel.onfocus =function() {
proverka(tel);
}
tel.onfocus = function() {
setCursorPosition(11, tel);
}
tel.oninput();
function validate() {
err.style.display = "none";
var ok = proverka(tel);
!ok && (err.style.display = "inline-block", err.innerHTML = "Введите корректно номер");
return ok
}
document.forms[0].onsubmit = validate
</script>
</body>
</html>
