javascript - 使用 jquery 禁用表单提交按钮 input=text 和 input=checkbox

Question

我有一个包含三个输入的表单([type=text]、多个输入[type=checkbox] 和一个禁用的提交按钮)。 如果用户填写了所有三个文本输入并且至少选择了一个复选框，我希望启用提交按钮。

我发现这个 fiddle 在所有三个文本输入上都很有效，但我想添加一个附加条件，即必须选择至少一个复选框:

$(document).ready(function() {
    var $submit = $("input[type=submit]"),
    $inputs = $('input[type=text], input[type=password]');

    function checkEmpty() {
        // filter over the empty inputs
        return $inputs.filter(function() {
            return !$.trim(this.value);
        }).length === 0;
    }

    $inputs.on('blur', function() {
        $submit.prop("disabled", !checkEmpty());
    }).blur(); // trigger an initial blur
});

fiddle

Answer 1

在复选框中添加 class="checkbox"，然后将 checkEmpty() 修改为:

function checkEmpty() {
    var text= $inputs.filter(function() {
        return !$.trim(this.value);
    }).length === 0;
    var checkbox = false;
    if ($(".checkbox:checked").length > 0) {
       checkbox = true;
    }
    if(text == true && checkbox == true){
        return true;
    }else{
        return false;
    }
}

然后为复选框添加点击事件:

$(".checkbox").on("click", function(){
    $submit.prop("disabled", !checkEmpty());
});