Проверка на регулярные выражения см в нутри

@allukard · Регистрация: 08.11.2010

Студворк — интернет-сервис помощи студентам

Проверка на регулярные выражения, как сделать если условия не верны ктопка не активна и показывает все блоки кторотые неверны! и можно как нибудь сократить код..

собственно вот!

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
</head>
<body>
<script type="text/javascript">
function login_s(){
    var login_a=/^[а-яА-Я!a-zA-Z0-9_]{6,20}$/;
    var login=document.getElementById('login');
    
    var login_verno=document.getElementById('login_verno');
    var login_neverno=document.getElementById('login_neverno');
if(login.value.search(login_a)!==-1){login_verno.style.display='inline';login_neverno.style.display='none';}else{login_neverno.style.display='inline';login_verno.style.display='none';}
}
 
function password_s(){
    var password_a=/^[а-яА-Я!a-zA-Z0-9_]{6,20}$/;
    var password=document.getElementById('password');
    
    var password_verno=document.getElementById('password_verno');
    var password_neverno=document.getElementById('password_neverno');
if(password.value.search(password_a)!==-1){password_verno.style.display='inline';password_neverno.style.display='none';}else{password_neverno.style.display='inline';password_verno.style.display='none';}
}
 
function chec(){
    var checkbox=document.getElementById('checkbox');
    var chec_verno=document.getElementById("chec_verno");
    var chec_neverno=document.getElementById('chec_neverno');   
    
if(checkbox.checked){chec_verno.style.display='inline';chec_neverno.style.display='none';}else{chec_neverno.style.display='inline';chec_verno.style.display='none';}
}
</script>
<form action="reg.php" method="POST">
<p>
Ваш Логин:<input id="login" name="login" type="text" size="25" maxlength="20" onchange="login_s()" class="text">
<div style="display:none; color:#ooffoo" id="login_verno"><span style="font-size:7pt; color:#333">ok</span></div>
<div style="display:none; color:red" id="login_neverno"><span style="font-size:7pt; color:#333">Минимальная длина Логина 6 символов.</span></div>
</p>
<p>
Ваш Пароль:<input id="password" name="password" type="pass" size="25"  onchange="password_s()" maxlength="20" class="text">
<div style="display:none; color:#ooffoo" id="password_verno"><span style="font-size:7pt; color:#333">ok</span></div>
<div style="display:none; color:red" id="password_neverno"><span style="font-size:7pt; color:#333">Минимальная длина Пароля 6 символов.</span></div>
</p>
<br>
Я согласен с данными правилами.:<input id="checkbox" type='checkbox' name='ok_reg' value='0' onclick="chec()"/>
<div style="display:none; color:#ooffoo" id="chec_verno">ok</div>
<div style="display:none; color:red" id="chec_neverno">err</div>
<br>
<input type="submit" name="submit" class="search_b" value="registration">
</form>
<?php
echo $_POST['login']."<br>".$_POST['password']."<br>".$_POST['ok_reg'];
?>
 
</body>
</html>

@kalabuni · 03.05.2012, 11:40

Замечаний много.
1. В регулярке вы фактически проверяете 2 условия:
-- чтобы количество символов было от 6 до 20;
-- чтобы не было пробельных символов.
Проверка на превышение верхнего предела не нужна, ибо в обоих полях у вас и так прописано maxlength="20".
Кроме того для непробельных символов имеется спецсимвол \S.
Так что регулярку можно упростить до минимума - /\S{6,}/

2. "Проверка на клиенте" - она нужна не только для "красивого оформления". Главная задача проверки - не дать клиенту отправить данные на сервер при неверном заполнении. У вас же можно спокойно нажать кнопку сабмита и отправить на сервер вообще пустые поля.

3. Кроме того, можно даже и не нажимать кнопку сабмита, а ограничиться нажатием клавиши Enter.

4. Верстка для вывода сообщений у вас архисложна - <DIV>, внутрь которого вложен <SPAN>, да ещё и не один такой <DIV>, а два - по количеству сообщений... При этом использование свойства стиля display приводит к тому, что при появлении любого сообщения нижележащее содержание страницы "прыгает" вниз.
Вполне достаточным будет иметь по одному <SPAN>'у, а невидимость обеспечить свойством visibility.

5. В двух случаях из трёх проверка у вас идентична. Поэтому плодить аж три разных функции - несолидно как-то. Вполне достаточно одной, коя будет проверять конкретные поля при их изменении и будет проверять ВСЁ при попытке отправить данные формы на сервер.

В общем, держите вариант код. Если что-то не так, как вам надо, или что-то непонятно - спрашивайте:

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
<!doctype>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
<form action="reg.php" method="post">
<p>Ваш Логин:
<input name="login" size="25" maxlength="20" class="text" autocomplete="off" onchange="TestForm (this)" /><br />
<span id="login_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>Ваш Пароль:
<input name="password" size="25" maxlength="20" class="text" onchange="TestForm (this)" type="password" /><br />
<span id="password_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>Я согласен с данными правилами:
<input name="ok_reg" type="checkbox" /><br />
<span id="reg_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>
<input name="sbmt" type="button" class="search_b" value="registration" onclick="TestForm (this)"/>
</p>
</form>
</body>
</html>

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
function TestForm (obj)
{
   function testField (x)
   {
   var z = {"login" : "логина" , "password" : "пароля"}
   var t = (x.value.length && x.value.search (/\S{6,}/) != -1);
   with (document.getElementById (x.name + '_s'))
      {
      style.visibility = 'visible';
      innerHTML = (t) ? 'ok' : 'Минимальная длина ' + z [x.name] + ' должна быть не менее 6 символов';
      style.color = (t) ? 'green' : 'red';
      }
   return t;
   }
if (obj.name != 'sbmt') return testField (obj);
else
   {
   var log = testField (obj.form.login), pass = testField (obj.form.password);
   var t = (obj.form.ok_reg.checked);
   with (document.getElementById ('reg_s'))
      {
      style.visibility = 'visible';
      innerHTML = (t) ? 'ok' : 'Вы должны ознакомиться и согласиться с правилами';
      style.color = (t) ? 'green' : 'red';
      }
   if (log && pass && t) obj.form.submit ();
   } 
}

@allukard · 03.05.2012, 12:28 **[ТС]**

kalabuni, Благодарю за помощь, да действительно лишние Дивы и много чего!

Сообщение от kalabuni

2. "Проверка на клиенте" - она нужна не только для "красивого оформления". Главная задача проверки - не дать клиенту отправить данные на сервер при неверном заполнении. У вас же можно спокойно нажать кнопку сабмита и отправить на сервер вообще пустые поля.

ну если честно то я в обработчие еще проверял

PHP
1
2
3
4
5
6
7
8
if (strlen($login)<=5 or strlen($login)>=20) die("<p>Логин должен быть минимум из 5-ти символов, но не более 20. <a href='javascript:history.back()' onMouseOver='window.status='Назад';return true' class='link_reg'>[ Назад ]</a></p>");
if (strlen($password)<=5 or strlen($password)>=20) die("<p>Пароль должен быть минимум из 6-ти символов, но не более 20. <a href='javascript:history.back()' onMouseOver='window.status='Назад';return true' class='link_reg'>[ Назад ]</a></p>");
if (!preg_match('/^[а-яА-Я!a-zA-Z0-9_]+$/', $login)) die ("<p>Ошибка ввода Логина, должен состоять только из букв и цифр. <a href='javascript:history.back()' onMouseOver='window.status='Назад';return true' class='link_reg'>[ Назад ]</a></p>");
if (!preg_match('/^[а-яА-Я!a-zA-Z0-9_]+$/', $password)) die ("<p>Ошибка ввода пароля, должен состоять только из букв и цифр.! <a href='javascript:history.back()' onMouseOver='window.status='Назад';return true' class='link_reg'>[ Назад ]</a></p>");
if (!preg_match('/^[0-9a-z_]+@[0-9a-z_^.]+\\.[a-z]{2,3}/', $_POST['email'])) die ("<p>Ошибка ввода E-mail. <a href='javascript:history.back()' onMouseOver='window.status='Назад';return true' class='link_reg'>[ Назад ]</a></p>");
if(!preg_match('/[.](JPG)|(jpg)|(jpeg)|(JPEG)|(gif)|(GIF)|(png)|(PNG)$/',$_FILES['uploadFile']['name']))die ("Фото должно быть в  формате <strong>JPG,GIF или PNG</strong>");
 
if (empty($login) or empty($password) or empty($famil) or empty($name) or empty($email)) //если пользователь не ввел логин, пароль, и т.д то выдаем ошибку и останавливаем скрипт.

да я проверял каждое поле((

Проверка на регулярные выражения см в нутри

хотелось бы также сделать красво!
решил добавить Почту

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
<script type="text/javascript">
function TestForm (obj)
{
   function testField (x)
   {
   var z = {"login" : "логина", "password" : "пароля", "email" : "email"}
   var t = (x.value.length && x.value.search (/\S{6,}/) != -1);
 
   with (document.getElementById (x.name + '_s'))
      {
      style.visibility = 'visible';
      innerHTML = (t) ? 'ok' : 'Минимальная длина ' + z [x.name] + ' должна быть не менее 6 символов';
      style.color = (t) ? 'green' : 'red';
      }
   return t;
   
   
   
   var email = (x.value.length && x.value.search (/^([a-z0-9_-]+\.)*[a-z0-9_-]+@[a-z0-9_-]+(\.[a-z0-9_-]+)*\.[a-z]{2,4}$/) != -1);
    with (document.getElementById (x.name + '_s'))
      {
      style.visibility = 'visible';
      innerHTML = (email) ? 'ok' : 'Введеный ' + z [x.name] + ' указан неправильно';
      style.color = (email) ? 'green' : 'red';
      }
   return email;
   }
   
   
if (obj.name != 'submit_reg') return testField (obj);
else
   {
   var t = (obj.form.ok_reg.checked);
   with (document.getElementById ('reg_s'))
      {
      style.visibility = 'visible';
      innerHTML = (t) ? 'ok' : 'Вы должны ознакомиться и согласиться с правилами';
      style.color = (t) ? 'green' : 'red';
      }
   if (testField (obj.form.login) && testField (obj.form.password) && testField (obj.form.email) && email && t )
      obj.form.submit ();
   } 
}
</script>

PHP
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
<!doctype>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
 
 
<form action="reg_1.php" method="post">
<p>Ваш Логин:
<input name="login" size="25" maxlength="20" class="text" onchange="TestForm (this)" /><br />
<span id="login_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>Ваш Пароль:
<input name="password" size="25" maxlength="20" class="text" onchange="TestForm (this)" type="password" /><br />
<span id="password_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>Ваш Почтовый адресс:
<input name="email" size="30" maxlength="30" class="text" onchange="TestForm (this)" /><br />
<span id="email_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>Я согласен с данными правилами:
<input name="ok_reg" type="checkbox" /><br />
<span id="reg_s" style="visibility: hidden; font-size: 8pt">ok</span>
</p>
<p>
<input type="button" name="submit_reg" class="search_b" value="registration" onclick="TestForm (this)"/>
</p>
</form>
</body>
</html>

но чтот криво работает! можете помоч

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

Проверка на регулярные выражения см в нутри

Решение