Как отключить/включить кнопку с помощью флажка, если флажок установлен

Мне нужен script, который может работать с приведенным ниже кодом HTML, чтобы отключить/включить кнопку, когда флажок установлен или снят,

<input type="submit" name="sendNewSms" class="inputButton" id="sendNewSms" value=" Send " />

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

Ответы

Ответ 1

brbcoding смог помочь мне с соответствующим кодированием, которое мне нужно, вот оно

HTML

<input type="checkbox" id="checkme"/>
  <input type="submit" name="sendNewSms" class="inputButton" disabled="disabled" id="sendNewSms" value=" Send " />

Javascript

 var checker = document.getElementById('checkme');
 var sendbtn = document.getElementById('sendNewSms');
 // when unchecked or checked, run the function
 checker.onchange = function(){
if(this.checked){
    sendbtn.disabled = false;
} else {
    sendbtn.disabled = true;
}

}

Ответ 2

Вы можете использовать onchange событие флажка, чтобы включить/отключить кнопку на основе checked value

<input type="submit" name="sendNewSms" class="inputButton" id="sendNewSms" value=" Send " />

<input type="checkbox"  onchange="document.getElementById('sendNewSms').disabled = !this.checked;" />

Ответ 3

HTML

<input type="checkbox" id="checkme"/><input type="submit" name="sendNewSms" class="inputButton" id="sendNewSms" value=" Send " />

JS

var checker = document.getElementById('checkme');
var sendbtn = document.getElementById('sendNewSms');
checker.onchange = function() {
  sendbtn.disabled = !!this.checked;
};

DEMO

Ответ 4

Для этого вам нужно будет использовать javascript или структуру JQuery. ее пример с использованием JQuery

   $('#toggle').click(function () {
        //check if checkbox is checked
        if ($(this).is(':checked')) {

            $('#sendNewSms').removeAttr('disabled'); //enable input

        } else {
            $('#sendNewSms').attr('disabled', true); //disable input
        }
    });

DEMO: http://jsfiddle.net/T6hvz/

Ответ 5

Вот простой способ отключить и включить кнопку отправки:

<input type="submit" name="sendNewSms" class="inputButton" id="sendNewSms" value=" Send " />
<input type="checkbox" id="disableBtn" />

var submit = document.getElementById('sendNewSms'),
    checkbox = document.getElementById('disableBtn'),
    disableSubmit = function(e) {
        submit.disabled = this.checked
    };

checkbox.addEventListener('change', disableSubmit);

Вот скрипка в действии: http://jsfiddle.net/sYNj7/

Ответ 6

Я рекомендую использовать jQuery, так как он сделает весь тяжелый подъем для вас. Код довольно тривиален.

$('input:checkbox').click(function () {
  if ($(this).is(':checked')) {
    $('#sendNewSms').click(function () {
      return false;
    });
  } else {
    $('#sendNewSms').unbind('click');
  }
});

Трюк состоит в том, чтобы переопределить событие 'click' и эффективно отключить его. Вы также можете следить за ним с помощью некоторой магии CSS, чтобы он выглядел "отключенным". Вот код в JavaScript, если он вам нужен. Он не идеален, но имеет смысл.

var clickEvent = function () {
  return false;
};
document.getElementById('#checkbox').onclick(function () {
  if (document.getElementById('#checkbox').checked) {
    document
      .getElementById('#sendNewSms')
      .onclick(clickEvent);
  } else {
    document
      .getElementById('#sendNewSms')
      .removeEventListener('click', clickEvent, false);
  }
});