Javascript 表单验证上html页面之间的导航

仅在静态页面上工作。。没有后端存在…Hi尝试在html页面之间导航，并且成功。但是，只有在表单正确验证时才需要切换页面，您已经尝试过，但它不起作用。。 需要一些帮助

HTML:

---

jQuery验证器具有自定义的成功和失败回调，您可以使用这些回调

按照您当前的方法，fnValidate将返回一个对象。所以你不知道它是否经过验证。因此，请尝试使用以下方法

$(document).ready(function () {
    $("#loginForm").validate({
        rules: {
            "loginForm-email": {
                required: true,
                email: true
            },
                "loginForm-password": {
                required: true,
                minlength: 5
            }
        },
        submitHandler: function () {
            console.log("inside valid");
            window.location.reload(true);
            window.location.href = '../html/userPage.html';
            // this.submit()
        },
        invalidHandler: function (event, validator) {
            // 'this' refers to the form
            console.log("Please fill the form");
        }


    });

});

JSFIDLE示例：

---

仅当表单有效时才调用submitHandler。这样你就可以提交表单了。

如果我是你，如果你想让你的js负责提交表单，我首先会避免使用button type=submit，而是使用type=button，否则我认为默认设置不起作用……另外，如果你想使用表单数据，而不是重定向窗口。位置。。。，您应该使用本机js表单提交功能…有没有办法加载其他html文件而不是使用window.location.href。。我试过使用.load，但它不起作用…将该URL作为表单的操作，只需丢弃自定义提交程序。validate插件应该只允许表单在验证时提交，然后它将转到其他HTML。我已经更新了JSFIDLE示例，正如@christian314159所说的，删除操作处理程序，只在表单标记中添加action属性。

$(document).ready(function () {
              var fnValidate =  $("#loginForm").validate({
                    rules: {
                        "loginForm-email": {
                            required: true,
                            email: true
                        },  
                        "loginForm-password": {
                            required: true,
                            minlength: 5
                        } 
                    }
                });

                 $('.btn').click(function(e) {
                    e.preventDefault();
                    if(fnValidate){
                    window.location.reload(true);
                    window.location.href = '../html/userPage.html';
                    }
                    else{
                        alert('hia');
                    }
                });

            });

$(document).ready(function () {
    $("#loginForm").validate({
        rules: {
            "loginForm-email": {
                required: true,
                email: true
            },
                "loginForm-password": {
                required: true,
                minlength: 5
            }
        },
        submitHandler: function () {
            console.log("inside valid");
            window.location.reload(true);
            window.location.href = '../html/userPage.html';
            // this.submit()
        },
        invalidHandler: function (event, validator) {
            // 'this' refers to the form
            console.log("Please fill the form");
        }


    });

});