JQuery验证插件给出错误?

时间:2013-08-21 11:24:35

标签: javascript jquery html html5

我正在使用JQuery验证插件。

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.js"></script>

Jquery代码:

function validateForm(){


        $('[name^="attribute"]').each(function(){
        $(this).rules("add", {
            required: true,
            messages: {
                required: "Mandatory field"
            }
        } );            
    });



    $('[name^="valueAttribute"]').each(function(){
        $(this).rules("add", {
            required: true,
            maxlength: 12,
            email: true,
            messages: {
                required: "Enter email",
                email: "Enter valid email",
                maxlength: "Maximum 12 characters"
            }
        } );            
    });


        return $("#myForm").validate({
          onfocusout: function(element) { jQuery(element).valid(); } 
    });

  }

但是上面的脚本给出了如下错误。

TypeError: $.data(...) is undefined
我在这做错了吗?如果我为每个删除所有内容并使用默认消息,它可以正常工作。

谢谢!

2 个答案:

答案 0 :(得分:0)

唯一的问题似乎是,在为表单初始化validator插件之前,您要在元素中添加规则

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.11.1/additional-methods.js"></script>

然后

jQuery(function ($) {
    function validateForm(){
        var validator = $("#myForm").validate({
            onfocusout: function(element) { jQuery(element).valid(); } 
        });

        $('[name^="attribute"]').each(function(){
            $(this).rules("add", {
                required: true,
                messages: {
                    required: "Mandatory field"
                }
            } );            
        });

        $('[name^="valueAttribute"]').each(function(){
            $(this).rules("add", {
                required: true,
                maxlength: 12,
                email: true,
                messages: {
                    required: "Enter email",
                    email: "Enter valid email",
                    maxlength: "Maximum 12 characters"
                }
            } );            
        });

        return validator;

    }

});

演示:Fiddle

答案 1 :(得分:0)

您没有使用$(document).ready();

试试这个

$(document).ready(function(){
     // do script here
});
希望它会有所帮助