Question

我有以下javascript代码来验证带有用户名和密码的简单登录表单 - 如果这会产生影响，那就是asp.net自定义验证程序的客户端验证。

    function userValidation(source, arguments) {
        if (arguments.Value != "" && arguments.Value != "User name") {
            if($(source).parents(".loginPanel").find(".errorAsterisk[style*='visible']").length==0) {
                $(source).parents(".loginPanel").css({ "background-color": "" });
            }
            arguments.IsValid = true;
        } else {
            $(source).parents(".loginPanel").css({ "background-color": "#ECC8C8" });
            arguments.IsValid = false;
        }
    }


    function passwordValidation(source, arguments) {
        var passVal = /^((?![<>]).){1,64}$/;
        if (arguments.Value != "" && arguments.Value != "Password" && passVal.test(arguments.Value)) {
            if($(source).parents(".loginPanel").find(".errorAsterisk[style*='visible']").length==0) {
                $(source).parents(".loginPanel").css({ "background-color": "" });
            }
            arguments.IsValid = true;
        } else {
            $(source).parents(".loginPanel").css({ "background-color": "#ECC8C8" });
            arguments.IsValid = false;
        }
    }

我还希望在用户成功填写表单时显示“正在加载”消息 - 这是我的代码...

    $(".loginPanel").on("click", "input[id*='Login']", function() {
        loadingPage2("", "Logging in...");
    });

问题是，即使页面无效，加载功能也会运行。

我可以包含它的任何想法只有在所有有效时才会运行？

由于

Answer 1

如果没有看到更多代码，您可以这样做：

var x = [];
function userValidation(source, arguments) {
        if (arguments.Value != "" && arguments.Value != "User name") {
            if($(source).parents(".loginPanel").find(".errorAsterisk[style*='visible']").length==0) {
                $(source).parents(".loginPanel").css({ "background-color": "" });
            }
            arguments.IsValid = true;
            x.push(true);
        } else {
            $(source).parents(".loginPanel").css({ "background-color": "#ECC8C8" });
            arguments.IsValid = false;
        }
    }


    function passwordValidation(source, arguments) {
        var passVal = /^((?![<>]).){1,64}$/;
        if (arguments.Value != "" && arguments.Value != "Password" && passVal.test(arguments.Value)) {
            if($(source).parents(".loginPanel").find(".errorAsterisk[style*='visible']").length==0) {
                $(source).parents(".loginPanel").css({ "background-color": "" });
            }
            arguments.IsValid = true;
            x.push(true);
        } else {
            $(source).parents(".loginPanel").css({ "background-color": "#ECC8C8" });
            arguments.IsValid = false;
        }
    }

function loading(){
    var confirmx = true;
    for (var i = 0; i < x.length; i++) {
        if (x[i] != true) {
            confirmx = false;
        }
    }
    if (confirmx){
        $(".loginPanel").on("click", "input[id*='Login']", function() {
            loadingPage2("", "Logging in...");
        });
    }
}
loading();  // run it!

您唯一需要检查的是此代码在所有验证功能之后运行。所以把这段代码放在脚本的末尾。

Answer 2

如何实现这一目标有多种方法。最简单的方法是设置一个全局变量e.q. success。在事件处理程序中，只需检查此变量的值。

jQuery - 仅当所有表单字段都有效时才运行加载图形函数

2 个答案: