LADYX,
Nexus, протестируйте этот вариант, разрешены Backspace и цифры
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<input value="" id="tel"> <input value="" > <input value="">
<script>
window.addEventListener("DOMContentLoaded", function() {
function setCursorPosition(pos, elem) {
elem.focus();
if (elem.setSelectionRange) elem.setSelectionRange(pos, pos);
else if (elem.createTextRange) {
var range = elem.createTextRange();
range.collapse(true);
range.moveEnd("character", pos);
range.moveStart("character", pos);
range.select()
}
}
function mask(event) {
if (this.selectionStart < 3) event.preventDefault();
var matrix = "+7 (___) ___ ____",
i = 0,
def = matrix.replace(/\D/g, ""),
val = this.value.replace(/\D/g, "");
if (def.length >= val.length) val = def;
this.value = matrix.replace(/[_\d]/g, function(a) {
return i < val.length ? val.charAt(i++) : a
});
i = this.value.indexOf("_");
if(event.keyCode == 8) i = this.value.lastIndexOf(val.substr(-1))+1;
if (i != -1) {
i < 5 && (i = 3);
this.value = this.value.slice(0,i);
}
if (event.type == "blur") {
if (this.value.length < 5) this.value = ""
} else setCursorPosition(this.value.length, this);
};
var input = document.querySelector("#tel");
input.addEventListener("input", mask, false);
input.addEventListener("focus", mask, false);
input.addEventListener("blur", mask, false);
input.addEventListener("keydown", mask, false);
});
</script>
</body>
</html>
|
рони,
да, вот как в этом, последнем вашем варианте, "+7" невозможно не удалить, не заменить, т.е. для "+7" не должны быть доступны: стрелки "налево" и "направо" и клавиши Delete и Backspace. А для любой цифры из набора "(111) 222 3333" напротив - разрешить и стрелки "налево" и "направо", и клавиши Delete и Backspace. Вот так можно сделать? Извините, пожалуйста, наверное уже задергали вас :) |
LADYX,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<input value="" id="tel"> <input value="" > <input value="">
<script>
window.addEventListener("DOMContentLoaded", function() {
var keyCode;
function mask(event) {
event.keyCode && (keyCode = event.keyCode);
var pos = this.selectionStart;
if (pos < 3) event.preventDefault();
var matrix = "+7 (___) ___ ____",
i = 0,
def = matrix.replace(/\D/g, ""),
val = this.value.replace(/\D/g, ""),
new_value = matrix.replace(/[_\d]/g, function(a) {
return i < val.length ? val.charAt(i++) || def.charAt(i) : a
});
i = new_value.indexOf("_");
if (i != -1) {
i < 5 && (i = 3);
new_value = new_value.slice(0, i)
}
var reg = matrix.substr(0, this.value.length).replace(/_+/g,
function(a) {
return "\\d{1," + a.length + "}"
}).replace(/[+()]/g, "\\$&");
reg = new RegExp("^" + reg + "$");
if (!reg.test(this.value) || this.value.length < 5 || keyCode > 47 && keyCode < 58) this.value = new_value;
if (event.type == "blur" && this.value.length < 5) this.value = ""
}
var input = document.querySelector("#tel");
input.addEventListener("input", mask, false);
input.addEventListener("focus", mask, false);
input.addEventListener("blur", mask, false);
input.addEventListener("keydown", mask, false)
});
</script>
</body>
</html>
|
Я таки ничего и не написал.
|
рони,
да, теперь семерка не удаляется. Но ругайте меня, бейте, кидайтесь в меня тапками и чем угодно :) Но наберусь наглости (но не подумайте, что я наглец), и попрошу еще пару штрихов, и тогда будет просто всё супер идеально. Представим, что набрали номер, например, (950) 222 3333, и нужно изменить девятку. И если клавишей "налево" нажать, держа ее пока курсор добежит до девятки, и если немного передержали и курсор остановился после семерки, то курсор "залипает" рядом с этой семеркой, и приходится мышкой устанавливать курсор в нужное место. Последние четыре цифры (троечки) если удаляем, то курсор остается на месте удаления, что хорошо. Если удаляем/правим другие цифры номера (двоечки или 950), то курсор перепрыгивает в конец. Сейчас когда набираем 950, потом набираем 2 (т.е. четвертую цифру) и появляется закрывающая скобка. А можно сделать так, чтобы при наборе 0 (т.е. третьей цифры) сразу появлялась закрывающая скобка? рони, простите за мою наглость совсем, правда, не наглого человека. :) я действительно очень вам благодарен. |
LADYX, вам принципиально, чтобы скрипт был на нативном js?
«jQuery Mask Plugin» смотрели? |
Nexus,
Цитата:
Цитата:
Да и что самое главное, считаю, раз уже взялись за этот скрипт, желательно довести его до кондиции, и не уважительно будет по отношению к рони его бросить. |
LADYX,
далее сами |
рони,
сам не сделаю. В любом случае вам огромное спасибо! |
Зачем три input ?
|
| Часовой пояс GMT +3, время: 09:46. |