jQuery 验证我想添加一个向上滚动缓慢的错误

Question

我想在表单上添加一个缓慢的滚动到顶部错误，只是不确定如何在此脚本上实现它。我已经尝试了其他一些人的建议，但作为新手无法让它工作。谢谢

  $(function() {
    // Setup form validation on the #register-form element
    $("#frmFormMail").validate({
        // Specify the validation rules
        rules: {
            field_0: { // Title
                required: true,
                minlength: 3
            },
            field_1: { // Full Name
                required: true,
                email: true,
                minlength: 5
            },
            field_2: { // Address
                required: true,
                minlength: 20
            },
            field_3: { // Age
                required: true,
                minlength: 2
            },
            field_4: { // Marital Status
                required: true,
                minlength: 3
            },
            field_5: { // Children
                required: true,
                minlength: 1
            },
            field_6: { // Nationality
                required: true,
                minlength: 3
            },
            field_7: { // Health
                required: true,
                minlength: 10
            },
            field_8: { // Glasses
                required: true,
                minlength: 3
            },
            field_9: { // Car Licence
                required: true,
                minlength: 10
            },
            field_10: { // Nationality
                required: true,
                minlength: 3
            },
            field_11: { // Website of interest 1
                required: false,
                minlength: 5
            },
            field_12: { // Website of interest 2
                required: false,
                minlength: 5
            },
            field_13: { // Applying for Position
                required: true,
                minlength: 3
            },
            field_14: { // Resume
                required: true
            },
            field_15: { // Cv
                required: true
            },
            field_16: { // Present Job
                required: true,
                minlength: 10
            },
            field_17: { // When can You Start
                required: true,
                minlength: 3
            },
            field_18: { // Relocate Dropdown
                required: true // required: false not a required field, required: true required field
            },
            field_19: { // Last 3 Jobs
                required: true,
                minlength: 30
            },
            field_20: { // Attach Reference
                required: false
            },
            field_21: { // Attach Other of interest
                required: false
            },
            field_22: { // Sutible for this job
                required: true,
                minlength: 100
            },
            field_23: { // Sutible for this job
                required: true,
                minlength: 100
            },
            field_24: { // Comments questions
                required: false,
                minlength: 50
            },
        },
// Specify the validation error messages
        messages: {
            field_14: {
                required: "This field is required - will validate on submit"
            },
            field_15: {
                required: "This field is required - will validate on submit"
            },
        },
        submitHandler: function(form) {
            form.submit();
        }
    });
  });

Answer 1

可以使用

jquery validator's invalidHandler回调来实现来自 jquery 验证器文档，

invalidHandler
Type: Function()
Callback for custom code when an invalid form is submitted. 

使用事件对象作为第一个参数调用，将验证器作为第二个参数进行调用。

因此，您的代码可以像下面这样合并，例如，

$("#frmFormMail").validate({
  invalidHandler : function() {
       $('html, body').animate({
            scrollTop: $("#frmFormMail").offset().top // scroll top to your form on error
        }, 2000);
   }
});

inValidHandler 引用