javascript - JQuery 验证插件给出错误？

Question

我正在使用 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

我在这里做错什么了吗？如果我删除所有内容并使用默认消息，它工作正常。

谢谢！

Answer 1

唯一的问题似乎是，您在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;

    }

});

演示：小提琴

Answer 2

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

尝试这个

$(document).ready(function(){
     // do script here
});

希望它会有所帮助