Question

请你看看this demo并告诉我为什么我无法通过

正确更改标志布尔值（var proceed = false;）的状态

if (emailInput($('#email')) && emptyPass($('#password'))) {}

正如您所看到的，我正在尝试检查emailInput() AND emptyPass()是否返回inputData，然后将布尔值更改为true但是当两个输入都为空时，代码似乎只能运行emailInput()！（如果用户填写电子邮件输入，则会显示密码错误消息）

$(function () {
    var proceed = false;
    var emailRegex = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;

    function emailInput(elem) {
        inputData = $.trim(elem.val());
        if (inputData == "") {
            elem.parent().after('<div class="alert alert-danger err" role="alert">Field Can Not Be Empty</div>').slideDown("slow");
        } else if (!emailRegex.test(inputData)) {
            elem.parent().after('<div class="alert alert-danger err" role="alert">Please Enter Valid Email Address</div>').slideDown();
        } else {
            return inputData;
        }
    }

    function emptyPass(elem) {
        inputData = $.trim(elem.val());
        if (inputData == "") {
            var $div = $('<div/>', {
                class: 'alert alert-danger err',
                role: 'alert'
            }).hide().text('No Empty');
            $div.insertAfter(elem.parent());
            $div.slideDown("slow");
        } else {
            return inputData;
        }
    }

    $("#login").on("click", function (e) {
        $(".err").hide();
        if (emailInput($('#email')) && emptyPass($('#password'))) {
            tempEmail = $('#email').val();
            tempPass = $('#password').val();
            proceed = true;
        }

        if (proceed) {
            var data = 'email=' + tempEmail + '&pass=' + tempPass;
            console.log(data);

        }
        e.preventDefault();
    });
});

@import url("https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css");
body {
    padding:50px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<form accept-charset="UTF-8" role="form" id="login-form" method="post">
    <fieldset>
        <div class="form-group input-group" id="emailBox"> <span class="input-group-addon">
            @
          </span>

            <input class="form-control" placeholder="Email" name="email" type="email" id="email">
        </div>
        <div class="form-group input-group" id="passBox"> <span class="input-group-addon">
            <i class="glyphicon glyphicon-lock">
            </i>
          </span>

            <input class="form-control" placeholder="Password" name="password" type="password" id="password">
        </div>
        <div class="form-group">
            <button type="submit" id="login" class="btn btn-primary btn-block">Access</button>
            </button>
    </fieldset>
</form>

Answer 1

两件事：首先，您需要使用inputData声明您的本地变量（var，&&）。其次，您需要了解&&运算符仅在左侧表达式成功时才会计算右侧表达式。如果电子邮件地址为空或无效，则var proceed = true; if (!emailInput($('#email'))) proceed = false; if (!emptyPass($('#password'))) proceed = false;将停止，密码字段将无法进行测试。

您可以确保双方都经过这样的测试：

proceed

之后，只有当电子邮件地址和密码都正常时，true才会为{{1}}。

Here is an updated version of your jsfiddle.

使用和运算符

1 个答案: