Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/88.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 带有jQuery验证插件的“下一步”按钮上的invalidHandler_Javascript_Jquery_Jquery Validate - Fatal编程技术网

Javascript 带有jQuery验证插件的“下一步”按钮上的invalidHandler

Javascript 带有jQuery验证插件的“下一步”按钮上的invalidHandler,javascript,jquery,jquery-validate,Javascript,Jquery,Jquery Validate,我正在使用jQuery验证插件设置一个表单,我的表单将有几个步骤,因此我将在每个步骤和单击下一步按钮时验证表单 问题是默认的“invalidHandler”仅在提交时起作用,但是如果单击自定义事件或任何其他按钮但未提交(在我的情况下是“下一步”按钮),如何调用它 下面是我的快速代码示例: $(function() { $("form").validate({ invalidHandler : function(form, v

我正在使用jQuery验证插件设置一个表单,我的表单将有几个步骤,因此我将在每个步骤和单击下一步按钮时验证表单

问题是默认的“invalidHandler”仅在提交时起作用,但是如果单击自定义事件或任何其他按钮但未提交(在我的情况下是“下一步”按钮),如何调用它

下面是我的快速代码示例:

$(function() {
                $("form").validate({
                    invalidHandler : function(form, validator) {

                        var errors = validator.numberOfInvalids();

                        if(errors) {
                            alert(errors);
                            validator.errorList[0].element.focus();
                        }

                    },
                    rules : {
                        name : 'required'
                    }
                });

                $('#next').click(function() {

                    var element = $('form');
                    var stepIsValid = true;
                    $("input.text").each(function(index) {
                        stepIsValid = element.validate().element($(this)) && stepIsValid;
                    });
                    if(!stepIsValid) {
                        return false;
                    }

                });
            });
以及带有“下一步”按钮的窗体:

<form>
            <label for="name">Name:</label>
            <input type="text" id="name" name="name" class="text" />
            <input type="button" value="Next" id="next" />
            <input type="submit" />
        </form>

姓名:
谢谢。

使用
.valid()
手动检查表单的状态:

$('#next').click(function() {
    var element = $('form');
    if (!element.valid()) {
        return false;
    }
});