Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.98/64: Рейтинг темы: голосов - 64, средняя оценка - 4.98
12 / 12 / 0
Регистрация: 03.10.2011
Сообщений: 343

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

27.10.2012, 13:35. Показов 12322. Ответов 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,529
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,529
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
Ответ Создать тему
Новые блоги и статьи
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android
8Observer8 26.01.2026
Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .
Установка Android SDK, NDK, JDK, CMake и т.д.
8Observer8 25.01.2026
Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .
Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf
8Observer8 25.01.2026
Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly
8Observer8 24.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль
iceja 24.01.2026
Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .
Модель сукцессии микоризы
anaschu 24.01.2026
Решили писать научную статью с неким РОманом
http://iceja.net/ математические сервисы
iceja 20.01.2026
Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .
http://iceja.net/ сервер решения полиномов
iceja 18.01.2026
Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru