jQuery回调无法正常工作

Question

我有以下代码，并且回调似乎无法正常工作。 我的理解是，如果用户名未定义或为空，则应显示＃username-error div，并且应将错误类添加到添加到用户名输入的get中。 只有完成所有这些操作后，才会触发警报。 但是，当我在浏览器中查看时，不会显示错误div，并且会触发警报。 显然，添加了“错误”类，因此可以合理地建议＃username-error div调用了.show（）函数，但肯定看起来不像它。 非常感谢您能给我提供提醒，仅在＃username-error div出现后才触发警报。

 <script type="text/javascript"> $(document).ready(function() { $("input[name='username']").bind("blur", function() { validateUsername(myFunction); }); $("input[type='submit']").bind("click", function() { validateUsername(myFunction); }); $("#username-error").hide(); $("#username-success").hide(); }); function myFunction() { if ($(".error").length > 0) { alert("errors on page"); return false; } } function validateUsername(callback) { var $username = $("input[name='username']"); if (typeof $username.val() === "undefined" || $username.val() === "") { $("#username-error").show(); $("#username-success").hide(); $username.addClass("error"); } else { $("#username-error").hide(); $("#username-success").show(); $username.removeClass("error"); } if (callback) { callback(); } } </script> 

Answer 1

您需要添加一个返回按钮，单击

$("input[type='submit']").bind("click", function() {
    return validateUsername(myFunction);
});

你应该返回true

function myFunction() {
    if ($(".error").length > 0) {
        alert("errors on page");
        return false;
    } 
    return true;
}

并在validate方法中添加return

function validateUsername(callback) {
    var $username = $("input[name='username']");
    if (typeof $username.val() === "undefined" || $username.val() === "") {
        $("#username-error").show();
        $("#username-success").hide();
        $username.addClass("error");
    } else {
        $("#username-error").hide();
        $("#username-success").show();
        $username.removeClass("error");
    }
    if (callback) {
        return callback();
    }

}

但是在这种情况下使用回调确实没有多大意义。