0

Как сделать <input class="btn"... активным при установке флажка на checkbox, и наоборот? т.е удалить disabled=""

<input id="form" required="" type="checkbox">
<label for="form">
Отправляя сообщение, я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта
</label>

<input class="btn" value="Заказать" type="submit" disabled="">

2 ответа 2

3

Можно достать атрибут и назначать ему true или false написал на js и на jquery

//JavaScript
form.onchange = function(){
  var button = document.body.getElementsByClassName('btn')[0];
  if(button.disabled) button.disabled = false;
  else button.disabled = true;
}

//Jquery
$('#form').on('change', function(){
  if($(this).is(':checked')) $('.btn').attr('disabled', false);
  else $('.btn').attr('disabled', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="form" required="" type="checkbox">
<label for="form">
Отправляя сообщение, я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта
</label>

<input class="btn" value="Заказать" type="submit" disabled="">

8
  • $('.btn').attr('disabled', !$(this).is(':checked'))
    – Qwertiy
    Commented 11 авг. 2017 в 15:00
  • Кстати, jQuery вроде не просили.
    – Qwertiy
    Commented 11 авг. 2017 в 15:01
  • Да можно и jQuery, как надежнее?
    – steep
    Commented 11 авг. 2017 в 15:03
  • @steep, при такой простой задаче и отсутствии IE8- совершенно без разницы.
    – Qwertiy
    Commented 11 авг. 2017 в 15:04
  • Использовать 'onchange', тем более для формы, плохо.
    – Qwertiy
    Commented 11 авг. 2017 в 15:10
2

document.getElementById('allow').addEventListener('change', function (e) {
  document.getElementById('submit').disabled = !e.target.checked
})
<form>
  <label><input type=checkbox id=allow> Разблокировать кнопку</label>
  <input type=submit id=submit value=Отправить disabled>
</form>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.