javascript - 如何在jQuery中查询匿名函数的多个条件或结果

Question

首先，我有一个带有多个输入字段和一些 Bootstrap 按钮的表单。现在，我想做的是检查是否满足两个条件(“所有输入字段都已填写吗？”；“是否至少按下了一个按钮？”)以使用户能够单击提交按钮。

这是我的代码:

function checkInput() {
    var inputFields = $("input[name=inp1],[name=inp2],[name=inp3]");
    var buttons = $("button[name=btn1],[name=btn2],[name=btn3]");
    var empty1;
    var empty2;

    buttons.click(function() {
        if(!$(this).hasClass('active')) {
            empty1 = false;
        } else {
            empty1 = true;
        }
    });

    inputFields.keyup(function() {
        inputFields.each(function() {
        if($(this).val().length == 0) {
                empty2 = true;
            } else {
                empty2 = false;
            }
        });
    });

    alert(empty1);
    alert(empty2);

    if(empty1 == true && empty2 == true) {
        $('button[name=submitBtn]').prop('disabled', false);
    } else {
        $('button[name=submitBtn]').prop('disabled', true);
    }
}

alert(...) 函数表示，empty1 和 empty2 是“未定义”，我可以理解。但我的问题是，如何从 buttons.click() 和 inputFields.keyup() 检索 true 或 false 值 之后查询它们？

Answer 1

问题是变量的范围，这些变量需要是全局的:

var empty1;
var empty2;

function checkInput() {
    var inputFields = $("input[name=inp1],[name=inp2],[name=inp3]");
    var buttons = $("button[name=btn1],[name=btn2],[name=btn3]");


    buttons.click(function () {
        if (!$(this).hasClass('active')) {
            empty1 = false;
        } else {
            empty1 = true;
        }
    });

    inputFields.keyup(function () {
        inputFields.each(function () {
            if ($(this).val().length == 0) {
                empty2 = true;
            } else {
                empty2 = false;
            }
        });
    });

    alert(empty1);
    alert(empty2);

    if (empty1 == true && empty2 == true) {
        $('button[name=submitBtn]').prop('disabled', false);
    } else {
        $('button[name=submitBtn]').prop('disabled', true);
    }
}

将其移到函数之外，它将起作用: 参见jsFiddle working example