Главная » Программирование » Как сделать кнопку неактивной, пока не отмечен чекбокс с помощью JS

Как сделать кнопку неактивной, пока не отмечен чекбокс с помощью JS

    Изменение вида кнопки по чекбоксу

    Задача. Стояла задача сделать так, чтобы кнопка формы Contact Form 7 выглядела неактивной до тех пор пока не будут отмечены определенные чекбоксы (галочки) в форме (вроде «Согласие на обработку..»). Т.е. сама кнопка и так не срабатывает пока не отмечены обязательные чекбоксы, но нужно сделать, чтобы еще и визуально это было видно.

    В принципе, по умолчанию Contact Form 7 делает такую функцию, но по какой-то причине это было переопределено.

    Пример:
    Обязазательное условие соглашение 1
    Обязазательное условие соглашение 2

    Решение. Используем JavasScript. Для кнопки нужно предусмотреть отдельный класс который будет давать ей серый цвет и прописать в стилях. Вешаем обработчик событий по клику на чекбоксы, с функцией, которая будет проверять у чекбоксов параметр checked на true / false, т.е. поставили галочку на чекбоксе или нет. Если оба чекбокса «true», то функция должна удалить у кнопки класс отвечающий за задание серого цвета.

    HTML

    JavaScript

    0 0 голоса
    Рейтинг статьи
    Подписаться
    Уведомить о
    guest

    Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.

    0 комментариев
    Межтекстовые Отзывы
    Посмотреть все комментарии