logo_s

САМОУЧКА

Сайт для тех, кто хочет научиться

 

 

 

 

 

 

Главная

О Нас

Публикации

Связь

 

 

 

 

 

 

 

Наши публикации

 

HTML для новичков

 

XHTML

 

CSS для новичков

 

CSS 3

 

JavaScript

 


< Предыдущая  Следующая >


JavaScript может использоваться для проверки полей форм на правильность заполнения перед их отправкой на сервер.

 

Проверка форм в JavaScript

Примеры проверок, которые возможно реализовать с помощью JavaScript:

  • Было ли данное поле заполнено;
  • В правильном ли формате пользователь указал свой адрес или email в соответствующем поле;
  • Совпадают ли значения введенные в два различных поля (часто используется для полей с паролем);
  • Не превышает ли значение введенное в поле максимально допустимую длину и т.д.

Проверка форм в JavaScript возможна благодаря событию onSubmit.

Если у тэга form атрибут onsubmit="return true" форма будет отправлена на сервер, если же onsubmit="return false", то форма на сервер отправлена не будет.

Пример

<html>
<head>
<script type="text/javascript">
function validate(){
//Считаем значения из полей name и email в переменные x и y
var x=document.forms["form"]["name"].value;
var y=document.forms["form"]["email"].value;
//Если поле name пустое выведем сообщение и предотвратим отправку формы
if (x.length==0){
document.getElementById("namef").innerHTML="*данное поле обязательно для
заполнения";
return false;
}
//Если поле email пустое выведем сообщение и предотвратим отправку формы
if (y.length==0){
document.getElementById("emailf").innerHTML="*данное поле обязательно для
заполнения";
return false;
}
//Проверим содержит ли значение введенное в поле email символы @ и .
at=y.indexOf("@");
dot=y.indexOf(".");
//Если поле не содержит эти символы знач email введен не верно
if (at<1 || dot <1){
document.getElementById("emailf").innerHTML="*email введен не верно";
return false;
}
}
</script>
</head>
<body>
<form name="form" onsubmit="return validate()">
Имя: <input type="text" name="name"> <span style="color:red" id="namef"></span><br />
e-mail: <input type="text" name="email"> <span style="color:red" id="emailf"></span>
<br /><input type="submit" value="Отправить форму">
</form>
</body>
</html>


< Предыдущая  Следующая >

 

 

 

 

 

 

 

 

Последние добавления

 

HotLog