如何使用jquery禁用提交按钮？

Question

I have a checkbox which needs to be checked in order for it to be possible to submit the form.

So I set the submit button disabled attribute to "disabled". Then I tried binding the checkbox to it like this so it would enable/disable the submit button. It does not work:

$('input[type=checkbox]#confirm').click(function() {
    if ($(this).is(':checked')) {
        $('#submitButton').removeAttr('disabled');
    } else {
        $('#submitButton').attr('disabled', 'disabled');
    }
});

The submit button stays disabled.

HTML:

<form enctype="application/x-www-form-urlencoded" method="post" action="/controller/action"><dl class="zend_form">
<dd id="confirm-element">
<input type="hidden" name="confirm" value="0"><input type="checkbox" name="confirm" id="confirm" value="1" class="input-checkbox"></dd>
<dt id="confirm-label"><label for="confirm" class="required">Lorem ipsum.</label></dt>
<dt id="submitButton-label">&#160;</dt><dd id="submitButton-element">
<input type="submit" name="submitButton" id="submitButton" value="Potvrdiť" class="input-submit" disabled="disabled"></dd>

<input type="hidden" name="csrf_token" value="ed3e9347145a3eb3d58c4c21d813df26" id=""></dl></form>

Answer 1

try

$('#confirm').change(function() {
   $('#submitButton').attr('disabled', !this.checked);
});

according to comments below, now this should fixed your problem.

$('#confirm').change(function() {
   $('#submitButton').button( "option", "disabled", !this.checked );
});

Answer 2

$("#submitButton").attr("disabled", true);

Answer 3

您可以禁用该按钮，但仍然可以单击该按钮，因此您必须从按钮取消绑定 click事件：

$("#submitButton").attr('disabled', 'disabled').unbind('click');