12 / 12 / 0
Регистрация: 03.10.2011
Сообщений: 343

Создать форму для ввода телефонного номера в формате хх-хх-хх

27.10.2012, 13:35. Показов 12350. Ответов 11
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте.. подскажите, как можно Создать форму для ввода телефонного номера в формате хх-хх-хх. И чтобы функция validphone(phone) проверила, стоит ли дефис в нужных позициях... Как это можно реализовать на JS и HTML?
Нашел вот такой код в просторах интернета, но работает он не совсем так, как надо.. То есть он не запрещает вводить вместо дефисов цифры. А может как то можно сделать, чтобы дефисы ставились сами?
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<HTML> 
 <HEAD> 
 <SCRIPT LANGUAGE="JavaScript"> 
 function validfn(fnm) 
 { 
 fnlen=fnm.length 
 if (fnlen == 0) 
 {alert("Вы должны ввести свое имя") 
document.dataentry.fn.focus()} 
 } 
 function validphone(phone) 
 { 
 len=phone.length 
 digits="0123456789" 
 if(len != 7 && len != 9) 
 {alert("Неверное количество знаков в номере") 
document.dataentry.phone.focus()} 
 
for(i=0; i<3; i++) 
 {if (digits.indexOf(phone.charAt(i))<0) 
 {alert("Это должны быть цифры") 
document.dataentry.phone.focus() 
 break} 
 } 
 
} 
 </SCRIPT> 
 </HEAD> 
 <BODY> 
 <FORM NAME="dataentry"> 
 <h2>Подтверждение данных</h2> 
 
Введите свое имя:<br> 
 <INPUT TYPE="text" NAME="fn" 
 onBlur="validfn(fn.value)"> 
 
<SCRIPT LANGUAGE="JavaScript"> 
 document.dataentry.fn.focus() 
 </SCRIPT> 
 
Введите номер телефона (ххх-хх-хх):<br> 
 <INPUT TYPE="text" NAME="phone" SIZE=10 > 
 
<INPUT TYPE="button" VALUE="Отправить" 
onClick="validphone(phone.value)"> 
 
</BODY> 
 </HTML> 
 
 
function validfn(fnm) 
 { 
 fnlen=fnm.length 
 if (fnlen == 0) 
 {alert("Вы должны ввести свое имя") 
document.dataentry.fn.focus()} 
 } 
 ..... 
 <body> 
 ..... 
 
<INPUT TYPE="text" NAME="fn" 
 onBlur="validfn(fn.value)"> 
function validphone(phone) 
 { 
 len=phone.length 
 digits="0123456789" 
 if(len != 7 && len != 9) 
 {alert("Неверное количество знаков в номере") 
document.dataentry.phone.focus()} 
 
for(i=0; i<3; i++) 
 {if (digits.indexOf(phone.charAt(i))<0) 
 {alert("Это должны быть цифры") 
document.dataentry.phone.focus() 
 break} 
 } 
<INPUT TYPE="text" NAME="fn" 
 onBlur="validfn(fn.value)"> 
 
<SCRIPT LANGUAGE="JavaScript"> 
 document.dataentry.fn.focus() 
 </SCRIPT> 
 
Введите номер телефона (ххх-хх-хх):<br> 
 <INPUT TYPE="text" NAME="phone" SIZE=10> 
 
<INPUT TYPE="button" VALUE="Отправить" 
onClick="validphone(phone.value)">
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
27.10.2012, 13:35
Ответы с готовыми решениями:

Поле для ввода номера в формате: 38(0**)***-**-**
Кто то делал поле для ввода номера в формате: 38(0**)***-**-** Мб как то быстренько это можно сделать ? То есть в поле должно быть...

Шаблон ввода телефонного номера
Доброго времени суток! Подскажите пожалуйста, как сделать шаблон ввода телефонного номера как на этой странице в самом ее низу. То есть в...

Создать форму для ввода пароля
как сделать что бы по нажатию на кнопку открывалась новая форма в которой нужно будет ввести пароль? помогите пожалуйста

11
 Аватар для oxmrn
11 / 11 / 4
Регистрация: 05.10.2012
Сообщений: 29
28.10.2012, 00:21
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<SCRIPT language=javascript>
function getVal() {
return document.getElementById('phone');
}
var digits="-0123456789";
function validPhone() {
for(i=0; i<getVal().value.length; i++)
{ if (digits.indexOf(getVal().value.charAt(i))<0) {
alert("Это должны быть цифры")
}
}
if (getVal().value.length == 3 || getVal().value.length == 6) {
getVal().value = getVal().value + '-';
}
}
</SCRIPT>
Введите номер телефона (ххх-хх-хх):<br> 
<INPUT TYPE="text" maxlength="9" id='phone' onkeyup='validPhone()'>
1
Эксперт JSЭксперт HTML/CSS
2436 / 1115 / 312
Регистрация: 23.06.2011
Сообщений: 3,530
28.10.2012, 20:31
Цитата Сообщение от oxmrn Посмотреть сообщение
Создать форму для ввода телефонного номера в формате хх-хх-хх
режем по два знака, как просили
но тут еще надо подумать
HTML5
1
<input type="text" value="" name="phon" id="phon" onkeyup="keyUp();">
JavaScript
1
2
3
4
5
6
7
8
9
10
11
function keyUp(){
var v=document.getElementById("phon").value;
v=v.replace(/-/g, "");
if(v.length%2==0){document.getElementById("phon").value=getNumeration(v);};
 };
 
function getNumeration(n){//поделить число по N знаков
n=n+"";//если откуда то число придёт
n=n.slice(0, n.length%2)+n.slice(n.length%2).replace(/(\d{2})/g, "-$1");
return n.replace(/^-/, "");//удалить первый символ
 };
Добавлено через 10 часов 53 минуты
немного по другому цифры делит, наверно так правильней, и курсор отслеживает
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
onload=function(){
document.getElementById("phon").onkeyup=keyUp;
 };
 
function keyUp(ev){
var obj, v, k, p, n;
k=ev?ev.keyCode:event.keyCode;
//в ие и в браузерах на его движке разных версий клавиша забой ведёт себя по разному, визуально символ стёрся, а v=obj.value; возвращает с тем казалось бы удалённым символом
//чтобы уговорить такие браузеры тормозим немного считывание
//таймер ни кому не мешает, зато работает везде, одна из старых версий оперы тоже имела такой грех
setTimeout(function(){//тормоз для ие, не успевает с клавишей забой
obj=document.getElementById("phon");
p=getCaretPos(obj);
v=obj.value;
n=v.length;
if(k>=48&&k<=57||k==8||k==46){//если цифры, забой или delete
v=v.replace(/-/g, "");//удаляем что было
v=getNumeration(v);
p=p+(v.length-n);//прибавляем разницу, 1, 0, -1
obj.value=v;}
//удаляем все левые символы
else{if(/[^0-9\-]/.test(v)){obj.value=v.replace(/[^0-9\-]/g, ""); p--;}};
setCaretPos(obj, p);//возвращаем курсор
}, 50);
 };
 
function getNumeration(v){//поделить число по N знаков
v=v+"";//если откуда то число придёт
var l=v.length-v.length%2;
return(v.slice(0, l).replace(/(\d{2})/g, "$1-")+v.slice(l)).replace(/-$/, "");
 };
 
function getCaretPos(obj){
if(typeof obj!="object"){obj=document.getElementById(obj);};
obj.focus();
if(document.selection){
var s=document.selection.createRange();
s.moveStart("character", -obj.value.length);
return s.text.length;}
else{if(obj.selectionStart||obj.selectionStart=="0"){return obj.selectionStart;}};
 };
 
function setCaretPos(obj, p){
if(typeof obj!="object"){obj=document.getElementById(obj);};
obj.focus();
if(obj.setSelectionRange){obj.setSelectionRange(p,p);}
else{if(obj.createTextRange){
var r=obj.createTextRange();
r.collapse(true);
r.moveEnd("character", p);
r.moveStart("character", p);
r.select();}};
 };
1
 Аватар для oxmrn
11 / 11 / 4
Регистрация: 05.10.2012
Сообщений: 29
29.10.2012, 16:20
Этот механизм хорошо реализован на Госуслугах, ввод СНИЛС, можно оттуда дернуть.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
29.10.2012, 17:10
oxmrn, да, на Госуслугах скрипт рабочий... в отличие от вышеприведённых

однако и там работает, увы, только на клавишный ввод
0
Эксперт JSЭксперт HTML/CSS
2436 / 1115 / 312
Регистрация: 23.06.2011
Сообщений: 3,530
29.10.2012, 21:03
Цитата Сообщение от oxmrn Посмотреть сообщение
Этот механизм хорошо реализован на Госуслугах, ввод СНИЛС, можно оттуда дернуть.
там 800!!!!! килобайт JS, 7 штук разных jquery
после удаления цифры курсор прыгает в конец номера, очень хорошо, замечательно, больше и пробовать не стал, пусть они сами бабушкам объясняют почему так происходит
0
 Аватар для oxmrn
11 / 11 / 4
Регистрация: 05.10.2012
Сообщений: 29
30.10.2012, 10:42
Цитата Сообщение от kalabuni Посмотреть сообщение
oxmrn, да, на Госуслугах скрипт рабочий... в отличие от вышеприведённых
Мой тоже черточки доставляет )
0
1 / 1 / 1
Регистрация: 11.12.2012
Сообщений: 149
29.12.2012, 22:09
Просто и легко!
http://digitalbush.com/project... ut-plugin/
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
30.12.2012, 05:56
Цитата Сообщение от Extalionez Посмотреть сообщение
Просто и легко!
да, просто
но совсем не "легко"... если речь о килобайтах
0
1 / 1 / 1
Регистрация: 11.12.2012
Сообщений: 149
30.12.2012, 11:54
Цитата Сообщение от kalabuni Посмотреть сообщение
да, просто
но совсем не "легко"... если речь о килобайтах
Господи! Он миниферный весит меньше 3.8KB. умный вебмастер объединит все javascript'ы в один и будет отдавать его с кодом 304 и там уже не важно сколько он весит. А вообще нашёл нечто более правильное, раширящее вышеуказанный плагин
http://andr-04.github.com/inputmask-multi/
0
0 / 0 / 0
Регистрация: 25.11.2012
Сообщений: 4
22.04.2013, 23:04
мне надо разделит номера в формате как калькулятор если напиши 1000000 ==> 1,000,000 или 1256500 ==> 1,256,500 как можно это сделать
0
 Аватар для JsLoveR
425 / 167 / 48
Регистрация: 05.12.2012
Сообщений: 855
23.04.2013, 04:04
Odilbek,
JavaScript
1
2
var num = "1256500";
alert(num.replace(/(\d{1,3})(?=(?:\d{3})+$)/g, '$1,'))
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
23.04.2013, 04:04
Помогаю со студенческими работами здесь

Создать форму для ввода значений
в общем, написал я код для лабораторной. но надо, что бы все данные из формы (окна) вводились. и в нее туда же все выводилось + в туда...

Создать форму для ввода диапазона значений
В общем о задаче: База данных служит для автоматизации учета бланков строгой отчетности. Будут храниться в среднем 500 индивидуальных...

Помогите создать форму для ввода данных
Здравтсвуйте, помогите создать форму для ввода данных. Добавлено через 1 час 37 минут покажите пример хотябы.

Создать форму для ввода данных в таблицу
Прошу помощи, пропустил предмет надо как-то выкарабкаться сдать контрольную.... Пользуясь средствами VBA создать форму для ввода данных в...

Создать форму с полем для ввода текста
Создать форму с полем для ввода текста. Данные, полученные в форме, вывести в новом окне. Использовать скрипт РНР. &lt;?php if...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
12
Ответ Создать тему
Опции темы

Новые блоги и статьи
Midnight Chicago Blues
kumehtar 24.03.2026
Такой Midnight Chicago Blues, знаешь?. . Когда вечерние улицы становятся ночными, а ты не можешь уснуть. Ты идёшь в любимый старый бар, и бармен наливает тебе виски. Ты смотришь на пролетающие. . .
Контроль уникальности заводского номера - вариант №2
Maks 24.03.2026
В отличие от предыдущего варианта добавлено прерывание циклов, также добавлены новые переменные для сохранения контекста ошибки перед прерыванием цикла: Процедура ПередЗаписью(Отказ, РежимЗаписи,. . .
SDL3 для Desktop (MinGW): Вывод текста со шрифтом TTF с помощью библиотеки SDL3_ttf на Си и C++
8Observer8 24.03.2026
Содержание блога Финальные проекты на Си и на C++: finish-text-sdl3-c. zip finish-text-sdl3-cpp. zip
Жизнь в неопределённости
kumehtar 23.03.2026
Жизнь — это постоянное существование в неопределённости. Например, даже если у тебя есть список дел, невозможно дойти до точки, где всё окончательно завершено и больше ничего не осталось. В принципе,. . .
Модель здравоСохранения: работники работают быстрее после её введения.
anaschu 23.03.2026
geJalZw1fLo Корпорация до введения программа здравоохранения имела много невыполненных работниками заданий, после введения программы количество заданий выросло. Но на выплатах по больничным это. . .
Контроль уникальности заводского номера - вариант №1
Maks 23.03.2026
Алгоритм контроля уникальности заводского (или серийного) номера на примере документа выдачи шин для спецтехники с табличной частью в КА2. Данные берутся из регистра сведений, по которому настроено. . .
Хочу заставить корпорации вкладываться в здоровье сотрудников: делаю мат модель здравосохранения
anaschu 23.03.2026
e7EYtONaj8Y Z4Tv2zpXVVo https:/ / github. com/ shumilovas/ med2. git
Программный отбор элементов справочника по группе
Maks 22.03.2026
Установка программного отбора элементов справочника "Номенклатура" из модуля формы документа в КА2. В качестве фильтра для отбора справочника служит группа номенклатуры. Отбор по наименованию. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru