Проверка совпадения 2-х полей input на jQuery
Специально для читателей нашего сайта я написал небольшой скрипт, который считывает содержимое двух (можно сделать и более) полей и сравнивает их между собой.
Для чего вам это может понадобиться? Предположим, у вас есть 2 поля – например, поле «Пароль» и поле «Подтверждение пароля». Мы сверяем эти поля и в случае расхождения данных - выводим соответствующее сообщение.
Итак, у нас есть форма с 2-мя полями:
<form method="post" name="form" action="">
<div>Введите пароль:</div>
<input type="text" class="password">
<div>Подтвердите пароль:</div>
<input type="text" class="cor_password">
<div class="error"></div>
<input type="submit" value="submit" id="submit">
</form>
Что нам нужно сделать?
1. Проверить совпадение второго поля с первым.
2. Если поля не совпадают, запретить отправку формы + вывод соответствующего сообщения.
Для решения этих задач воспользуйтесь следующим скриптом:
<script>
$(".cor_password").on("keyup", function() { // Выполняем скрипт при изменении содержимого 2-го поля
var value_input1 = $(".password").val(); // Получаем содержимое 1-го поля
var value_input2 = $(this).val(); // Получаем содержимое 2-го поля
if(value_input1 != value_input2) { // Условие, если поля не совпадают
$(".error").html("Пароли не совпадают!"); // Выводим сообщение
$("#submit").attr("disabled", "disabled"); // Запрещаем отправку формы
} else { // Условие, если поля совпадают
$("#submit").removeAttr("disabled"); // Разрешаем отправку формы
$(".error").html(""); // Скрываем сообщение
}
});
</script>
Скрипт подробно комментирован, и разобраться в нем, думаю, труда не составит. И, разумеется, его можно переделать под свои нужды и адаптировать под любую CMS.