Отправляет email-рассылки с помощью сервиса Sendsay

Web-программирование - это просто!

Подписаться Бесплатная «Серебряная» новостная рассылка . Подписчиков 681 RSS
←   Декабрь 2016   →
 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


За последние 60 дней ни разу не выходила


Сайт рассылки: http://www.easyprog.ru
Открыта: 27-06-2009
Адрес автора: comp.soft.prog.easyweb-owner@subscribe.ru

Автор
Александр

Статистика

681 подписчиков
0 за неделю
←   Все выпуски   →

Web-программирование - это просто!


Новое на сайте Программирование - это просто! (www.easyprog.ru):

В платном разделе

В бесплатном разделе

 

Web-программирование: "Java Script(JS): Проверка содержимого полей."

 

Проверка содержимого полей, как правило, более сложная задача, чем проверка их заполнения. Тут мы проверяем само содержимое поле, соответствует ли оно допустимому формату ввода. Например, нам надо, чтобы пользователь мог вводить только цифры (нужно ввести целое число). Разумнее всего было бы орагнизовать такую проверку при нажатии пользователя на клавишу (событие ONKEYPRESS). Давайте рассмотрим пример:

<html>

    <head>

        <meta charset="UTF-8">

        <title>Урок 118. Java Script (JS): Проверка данных перед оправкой формы</title>

        <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

            function validate(form) {

                if(!form.numbers.value) {

                    alert("Введите число!");

                    form.numbers.focus();

                    return false;

                }

                return true;

            }

           

            function onKeyPress(ev) {

                evt = (ev) ? ev : event;

                var elem = (evt.target) ? evt.target : evt.srcElement;

                var code = (evt.charCode) ? evt.charCode : evt.keyCode;

                if(code > 31 && (code < 48 || code > 57)) {

                    alert("Сюда можно вводить только цифры");

                    elem.focus();

                    return false;

                }

                return true;

            }

        </SCRIPT>

    </head>

    <body>

        <form name="myform" method="GET" action="script.html">

            Сюда введите число <input type="text" name="numbers" ONKEYPRESS="return onKeyPress(event)"></input><br>

            <input type="submit" value="OK" name="ok" ONCLICK="return validate(this.form)">

        </form>

    </body>

</html>

 

И результат работы данного примера:

 

 

 

А что если надо вводить дробные числа? Тогда придется разрешить еще и точку:

            function onKeyPress(ev) {

                evt = (ev) ? ev : event;

                var elem = (evt.target) ? evt.target : evt.srcElement;

                var code = (evt.charCode) ? evt.charCode : evt.keyCode;

                if(code > 31 && (code < 48 || code > 57) && code!=46) {

                    alert("Сюда можно вводить только цифры");

                    elem.focus();

                    return false;

                }

                return true;

            }

 

Код точки 46. Вообще, если вы хотите узнать код какого либо символа, то вы можете вставить в код такую строку:

alert(code);

 

Правда, у нашей программы есть недочет: можно поставить сразу две или три точки и причем, даже не на месте:

 

 

Как быть? Ну, во-первых, можно проверять, чтобы точка была только одна и при том не в начале строки. То есть, анализировать уже введенный текст, а не то что нажимает пользователь. Можно такую задачу решить "в лоб", написав парсер строки. Но лучше всего, конечно, использовать регулярные выражения, о них пойдет речь в будущих уроках.

 
В избранное