jquery - 有没有一个好的方法来处理不显眼的验证看似异步的行为？

Question

我在提交表单时运行了以下缩写的验证代码。为我的表单设置了不显眼的验证。

(function () {
    "use strict";

    $("#feedbackForm").submit(function () {
        var t = $(this).serialize();
        var val = $(this).validate();
        console.log(val.errorList.length);
        return false;
    });
})();

当我在 Chrome 中命中断点时，我看到以下行为:

您可以从控制台看到，当代码最初执行时，它在验证的错误列表中识别出 0 个错误，但是当我通过断点暂停执行时，它在验证的错误列表中识别出 4 个错误。此外，在第一次之后，在运行时会正确计算正确的错误数。

• 这怎么可能？
• 如何获取运行时的正确错误数？

<小时/>

编辑1:

我无法在 jsfiddle 上重现此问题，因此肯定还有其他问题发生。

Fiddle

<小时/>

编辑2:

我还必须注意，在提交处理程序中使用 setTimeout() 每次都会在第二次获得正确的结果，但这似乎只能证实 mattytommo 在他的答案中提到的内容。

Answer 1

您可以使用同步invalidHandler 检查来代替validate。这样您就知道它已经完成。

它可能在您的 Fiddle 中工作的原因可能是巧合，因为它验证表单的速度更快，但实际实现的速度较慢。

尝试这样的事情:

$("#feedbackForm").submit(function () {
    var t = $(this).serialize();
    $(this).validate({
        invalidHandler: function(event, validator) {
            var errors = validator.numberOfInvalids();
            if (errors) {
                if (validator.errorList.length > 0) {
                    for (x=0;x<validator.errorList.length;x++) {
                        console.log("\n\u25CF " + validator.errorList[x].message);
                    }
                }
            }
        }
    });

   $(this).validate();

    return false;
});