Снова ищем одного-двух вордпрессеров в нашу команду!

Использование нескольких обработчиков событий

В качестве примера давайте напишем довольно простой код для валидации поля формы с e-mail. Если пользователь не указал свой e-mail адрес, то он увидит сообщение об ошибке. Как только он укажет его, сообщение об ошибке исчезнет.

Этот пост именно об использовании событий JQuery, поэтому ничего лишнего вы не увидите.

Поле E-mail можно (нужно!) проверять ещё и на правильность заполнения.

Итак, после того, как снимается фокус с поля input #email, будет выполняться функция проверки.

$('#email').blur(function(){
	if($(this).val() == ''){
	// если поле не заполнено, вывод сообщения об ошибке
		} else {
	// скрываем сообщение об ошибке (если оно отображено)
		}
	});

Но что делать, если мы хотим также проверять значение поля при нажатии клавиши? Правильным ли будет добавление ещё одной такой же функции, но только привязка её к событию keyup?

$('#email').keyup(function(){
	// функция проверки
	});

Нет конечно 🙂 Ведь можно объединить несколько обработчиков событий в один при помощи bind.

$('#email').bind('blur keyup', function(){
	if($(this).val() == ''){
	// если поле не заполнено, вывод сообщения об ошибке
		} else {
	// скрываем сообщение об ошибке (если оно отображено)
		}
	});

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

Миша

Впервые познакомился с WordPress в 2009 году. С 2014 года меня можно встретить на WordCamp по всему миру — официальной конфе по WordPress, иногда там выступаю, но с 2019 выступаю только на тех, которые сам организовываю. Также периодически школа Epic Skills и LoftSchool приглашают меня вести у них уроки/вебинары.

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля — пишите мне.

Оставить комментарий

Если вы хотите добавить код, не забудьте обернуть его в <pre lang="php"></pre>, в случае несоблюдения этого условия в 99% случаях ваш коммент будет удалён, а автор заблокирован. Печалька.