Проверяем, отметил (checked) ли пользователь хотя бы один флажок (checkbox)
В этом снипете мы проверим отметил (checked
) ли пользователь хотя бы один флажок (checkbox
) в форме.
В этом примере кнопка submit
становится disabled
, если не выбран (checked
) хотя бы один флажок; соответственно, если посетитель отметил хотя бы один флажок, кнопка становится enabled
.
Хитрость заключается в том, что вы можете использовать .is(":checked")
для объекта jQuery (а это набор элементов) и возвращать true
, если любой из этих элементов отмечен (checked
), в противном случае будет возвращаться false
. Далее, используя метод attr
, вы можете включать или отключать атрибут disabled
.
HTML
<form>
<!-- bunch of checkboxes like: -->
<input type="checkbox" ... >
<input type="checkbox" ... >
<!-- submit button, defaults to disabled -->
<input type="submit" value="submit">
</form>
jQuery
var checkboxes = $("input[type='checkbox']"),
submitButt = $("input[type='submit']");
checkboxes.click(function() {
submitButt.attr("disabled", !checkboxes.is(":checked"));
});
// или
$('#formcheckboxExample input[type="checkbox"]').change(function () {
if ($(this).is(":checked"))
{
$("#formcheckboxExample input[type='submit']").attr("disabled", false);
}
else
{
$("#formcheckboxExample input[type='submit']").attr("disabled", true);
}
});
Комментарии к статье
Спасибо помогло! А как сделать, чтобы Option1 исключить из рассмотрения? Чтобы его состояние не влияло на disabled кнопки.
Спасибо за статью!
А подскажите как сделать так, чтобы кнопка стала активной только когда отмечены все (в моём случае два) чексбоксы?
Спасибо за статью!
А подскажите как сделать так, чтобы кнопка стала активной только когда отмечены все (в моём случае два) чексбоксы?