Как отключить/включить кнопку с помощью флажка, если флажок установлен
Мне нужен 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);
}
});