Question

如何启用＆＃34;按钮＆＃34;何时单击所有复选框？

例如：

<form action="">
  <input type="checkbox" class="checkbox" id="button1" />
  <input type="checkbox" class="checkbox" id="button2" />
  <input type="checkbox" class="checkbox" id="button3" />

  <input type="submit" value="Checkout" id="submitbutton" disabled="disabled"/>
</form>

Answer 1

$(function(){
    // on change event
    var bool;
    $("input.checkbox").change(function() {
        bool = $(".checkbox:not(:checked)").length !=0;
    // enable/disable
       $("#submitbutton").prop('disabled', bool);
    })
});

<强> DEMO

Answer 2

每当点击一个复选框时，如果有任何未选中的框，请设置disabled属性。

$(".checkbox").change(function() {
    $("#submitbutton").prop('disabled', $(".checkbox:not(:checked)").length != 0);
})

Answer 3

这应该有效

//grab the set of check-boxes just one time:
var $checkboxes = $('form [type="checkbox"]');

//on each click, look at them, if there are no unchecked boxes, un-disalbe the submit:
$checkboxes.on('change', function(){
    if(!$checkboxes.filter('not:([checked])').length){
        $('submitbutton').prop('disabled', false);
    }
}

Answer 4

所有你需要做的就是使你现有的代码更加通用，以便工作单击任何一个复选框时，检查每个复选框。

请参阅this adaptation of your JSFiddle。

$(document).ready(function() {
    $( '[type="checkbox"]' ).click(function() {
        if( allChecked() ){
           $("#submitbutton").removeAttr("disabled"); 
        }
        else{
            $("#submitbutton").attr("disabled", "disabled");
        }
    });
}); 

function allChecked(){
    var checkboxes = $( '[type="checkbox"]' ),
        allChecked = true;

    checkboxes.each( function( i, e ){
        allChecked = allChecked && $(e).is( ":checked" );
    });

    return allChecked;
}

jQuery：如果只点击所有复选框，如何启用按钮？

4 个答案: