5

好的，我想我错了……但我似乎无法得到答案。我只是想创建一个成功复选标记或指示用户在输入表单中输入的内容是有效的。脚本的注释掉部分是我试图实现的想法。这是脚本：

$('document').ready(function(){
    $('form').validate({
        rules: {
           a: {required:true, minlength:2},
           b: {required:true}
        },      
        messages: {
           a: {required: "enter your name!"},
           b: {required: "enter the date!"}                        
        },
        errorPlacement: function(error, element) {
        if(element.attr('name') == 'a'){
             $('#name').html(error);                
         }
         if(element.attr('name') == 'b'){
             $('#date').html(error);                
         }
        },
        success: function(error){
            //a: {$('#name').html('nice name!');},
            //b: {$('#date').html('nice date!');}                           
        },
        debug:true
    });
    $('#a').blur(function(){
        $("form").validate().element("#a");
    });
});

这是html：

<form action="#" id='commentForm'>
    <input type="text" name="a" id="a">
    <input type="text" name="b" id="b">
    <button type="submit">Validate!</button>
<div id="date" style="border:1px solid blue;"></div>
<div id="name" style="border:1px solid red;"></div>
</form>

最后但同样重要的是，这里是 jsfiddle：

http://jsfiddle.net/mmw562/wQxQ8/8/

非常感谢您的帮助！

4

3 回答 3

6

里面的部分success:可能是一个类名或一个 JavaScript 回调函数，它看起来就像任何其他函数一样。但是，相反，您将其编写为一组插件选项。还有，既然叫“成功”，为什么error没有的时候还要传进去呢？ 根据文档，它应该看起来像这样......

success: function(label){
    label.addClass("valid").text("Ok!");                        
},

http://docs.jquery.com/Plugins/Validation/validate#toptions

如果指定，则显示错误标签以显示有效元素。如果给定一个字符串，则将其作为一个类添加到标签中。如果给定了一个函数，则使用标签（作为 jQuery 对象）作为其唯一参数调用它。这可用于添加诸如“ok！”之类的文本。

这是您的 jsFiddle 稍作修改以显示基本概念。也许您可以background-image在.valid class.

http://jsfiddle.net/wQxQ8/12/

于 2012-11-24T19:58:14.403 回答
4

这是一个可能的解决方案：

$('document').ready(function(){
    $('form').validate({
        rules: {
           a: {required:true, minlength:2},
           b: {required:true}
        },      
        messages: {
           a: {required: "enter your name!"},
           b: {required: "enter the date!"}                        
        },
        errorPlacement: function(error, element) {
        if(element.attr('name') == 'a'){
             $('#name').html(error);                
         }
         if(element.attr('name') == 'b'){
             $('#date').html(error);                
         }
        },
        success: function(label) {
            var parentId = $(label).parent().attr("id");
            switch(parentId) {
                case "name":
                    $(label).html("nice name");
                    break;
                case "date":
                    $(label).html("nice date");
                    break;
            }                    
        },
        debug:true
    });
    $('#a').blur(function(){
        $("form").validate().element("#a");
    });
});

更新小提琴：http: //jsfiddle.net/wQxQ8/13/

于 2012-11-24T20:05:26.670 回答
2

要回答标题，而不是您的实际问题：

这是检查某个输入的 JQuery 验证是成功还是失败的方法，它返回 true / false 布尔值：

$("[name='ConfirmCode']").valid(); // RETURNS true/false

例子：

if (!$("[name='ConfirmCode']").valid())
   return;

要检查整个表单的验证状态，请使用：

$('form').valid(); // RETURNS true/false

要在验证过程结果中包含隐藏输入：

$('form').validate({
   ignore: []
});
于 2018-11-09T18:24:05.103 回答