如何检测jQuery验证何时完成,并根据该事件调用某些内容?

时间:2011-06-21 08:21:46

标签: javascript jquery jquery-validate cufon

我是jQuery的新手。

使用jQuery验证插件& cufon同时给了我很多时间。

基本上,我想在jQuery Validation完成它必须做的事情之后检测事件并在它之后直接调用Cufon.refresh()。

$('#commentForm').validate({
    rules: {
        password: {
            required: true,
            minlength: 8,
            maxlength: 8,
            number: true
        },
    }
});

当表单无效时,我们期待<label class="error"> SOME TEXT </label>

一旦创建,我想在jQuery Validation创建的标签上使用Cufon.refresh()。 如何检测jQuery验证何时完成,并根据该事件调用某些内容?

任何帮助非常感谢。 问候, 彼得

6 个答案:

答案 0 :(得分:10)

感谢@Ariel - 如果取得了成功&#39;必须有一个不成功的&#39;所以..

工作代码:

$('#commentForm').validate({
    rules: {
        password: {
            required: true,
            minlength: 8,
            maxlength: 8,
            number: true
        }
    },
    showErrors: function(errorMap, errorList) {
        this.defaultShowErrors();
        Cufon.refresh();
        //alert('not valid!')
    },
    success: function() {
        //alert('valid!')
    }
});

再次感谢您的想法!

答案 1 :(得分:3)

使用success选项:

$('#commentForm').validate({
    rules: {
        password: {
            required: true,
            minlength: 8,
            maxlength: 8,
            number: true
        },
    }
    success: function() { .... }
});

请注意,在密码对象的close括号后面有一个额外的逗号。这将在IE中出错。

答案 2 :(得分:1)

submitHandler: { function(){ bla bla }}

这将允许您在完成验证后执行代码。您需要放置一个提交表单片段,因为它取代了默认的处理程序。

编辑:

    // specifying a submitHandler prevents the default submit 
    submitHandler: function() { 
        alert("submitted!"); 
    }, 
    // set this class to error-labels to indicate valid fields 
    success: function(label) { 
        // set   as text for IE 
        label.html(" ").addClass("checked"); 
    } 

你可以用任何一种来做你想做的事。 submitHandler允许您停止提交和执行代码(您可以在提交代码之前使用它来执行代码)或者在提交后执行代码成功。

答案 3 :(得分:1)

 <script src="js/validate/jquery-1.11.1.min.js"></script>
 <script src="js/validate/jquery.validate.min.js"></script>
 <script src="js/validate/additional-methods.min.js"></script>

<script>
    jQuery.validator.setDefaults({
        success:  "valid"
    });

    var form = $("#myform");
    form.validate({
        rules: {
           name: {required: true, minlength: 2},
            lastname: {required: true, minlength: 2}
        }

    });

    $("#button").click(function() {
        if(form.valid() == true ) { // here you check if validation returned true or false 
            $("body").addClass("loading");
        }
    })

</script>

答案 4 :(得分:0)

将其放在errorPlacement选项中。

errorPlacement: function(error, element) {
  error.appendTo( element.parent() );
  yourCodeHere();
}

答案 5 :(得分:0)

$(document).ready(function() {  
    $('#commentForm').submit(function(){
        var validationResponse = $('#commentForm').valid();

        if(validationResponse) {
            // when true, your logic
        } else {
            // when false, your logic
            return false;
        }
    });

    $("#commentForm" ).validate({
        rules: {
            "first_name": {
                required: true
            }
        },
        messages: {
            "first_name": {
                required: "First Name can not be empty"
            }
        }
    });
});