Question

我正在按照教程创建一个启用了禁用按钮的复选框，当您取消选中该框时，该按钮将再次被禁用。问题是，当我取消选中该框时，似乎复选框仍处于“开启”状态，因为该按钮未被禁用。该代码适用于Chrome，但不适用于Firefox 3.6。

这是我的代码：

<p><input type="checkbox" id="agree" >I agree</p>
<input id="continue" type="button" value="continue" disabled='true'>


<script>
        $('#agree').change(function(){
       var state = $(this).attr('value');
        if(state == 'on'){
        $('#continue').removeAttr('disabled');
        }else if(state == ''){
            $('#continue').attr('disabled', 'false');
        }
        });
    </script>

Answer 1

复选框的检查值不会随.val()更改，您应该使用.is('checked')，如下所示：

$('#agree').change(function() {
    var state = $(this).is(':checked'); //state = true/false depending on state
    if (state) { //if true
        $('#continue').removeAttr('disabled'); //remove disabled
    } else { //else (false)
        $('#continue').attr('disabled', 'disabled'); //add disabled (you shouldn't set it to 'false' as it WILL be disabled and it'll confuse you.
    }
});

这是一个 Example 来查看我的观点。

Answer 2

试试这个：

$('#agree').change(function() {
    if($("#agree").is(":checked"))
        $('#continue').removeAttr('disabled');
    else
        $('#continue').attr('disabled', false);
});

http://jsfiddle.net/TGQZs/1/

Answer 3

尝试：

$(function() {
    $('#agree').click(function() {
        if ($(this).is(':checked')) $('#continue').attr('disabled', false);
        else $('#continue').attr('disabled', true);
    });
});

LINK：http://jsfiddle.net/Mmm4h/

取消选中复选框后返回“on”值

3 个答案: