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

Question

首先，我有一个包含多个输入字段和一些Bootstrap-Button的表单。 现在，我要检查的是是否满足两个条件（“是否已填写所有输入字段？”，“是否按下了至少一个按钮？”）以使用户能够单击“提交”按钮。

这是我的代码：

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工作示例中查看