Проверка заполнения полей формы на jQuery

Решение, как сделать проверку заполнения полей в форме при помощи jQuery плагина

Пример простой формы обратной связи с использованием плагина проверки полей. Для этого понадобится плагин jquery.validate.js и библиотека jQuery.

Решение:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Проверка заполнения полей формы с помощью jQuery</title>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>

<script>
	$(document).ready(function(){
    	$("#demoForm").validate();
  	});
		$.validator.messages.required = "Заполните поле!";
		$.validator.messages.email = "Неверный формат email";
		$.validator.messages.url = "Неверный формат url, начните с http://";
</script>	
</head>
	<body>
		 <form id="demoForm" method="get" action="">
			 <fieldset>
			   <div>
				 <label>Имя</label>
				 <em>*</em><input name="name" size="25" class="required" minlength="2" />
			   </div>

			   <div>
				 <label>E-Mail</label>
				 <em>*</em><input name="email" size="25"  class="required email" />
			   </div>

			   <div>
				 <label>URL сайта</label>
				 <em>  </em><input name="url" size="25"  class="url" value="" />
			   </div>

			   <div>
				 <label>Комментарий</label>
				 <em>*</em><textarea name="comment" cols="22"  class="required"></textarea>
			   </div>

			   <div>
				 <input type="submit" value="Отправить"/>
			   </div>
			 </fieldset>
		 </form>
	</body>
</html>

Для работы проверки потребуется наличие библиотеки jQuery и плагина jquery.validate.js
Чтобы поле обозначить обязательным к заполнению, в input пишем class="required"
Так же используются проверки на правильность заполнения email, url и другие варианты, которые описываются на официальном сайте jQuery. На данном примере пишем в class="required email" или class="url"
По умолчанию уведомление об ошибке выводится на английском языке, чтобы изменить текст незаполненного поля, добавляем соответствующие строки в тело скрипта:

$.validator.messages.required = "Заполните поле!";
$.validator.messages.email = "Неверный формат email";
$.validator.messages.url = "Неверный формат url, начните с http://";

Не понятно? Нажми тут для помощи!