<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="js/jquery.js"></script>
    <script src="js/jquery.validate.js"></script>
    <script src="js/messages_zh.js"></script>
    <title>Title</title>
</head>
<body><p style="display: none;" id="copyDom">
    <label for="myname">用户名:</label>
    <!-- id和name最好同时写上 -->
    <input id="myname" name="myname" value="" class="onlyLetterAndDigit"/>    <label for="myadder">地址:</label>
    <!-- id和name最好同时写上 -->
    <input id="myadder" name="myadder" value="" class="onlyLetterAndDigites"/>
</p><form action="#" method="post" id="regForm">
    <fieldset>
        <legend>jquery-validate表单校验验证</legend>
        <p>
            <label for="myname" >用户名:</label>
            <!-- id和name最好同时写上 -->
            <input id="myname" name="myname" class="onlyLetterAndDigit"/>
            <label for="myadder">地址:</label>
            <!-- id和name最好同时写上 -->
            <input id="myadder" name="myadder" class="onlyLetterAndDigites"/>
        </p>        <div id="addDoms">        </div>
        <button id="addDom">新增</button>        <input type="submit" value="提交">
    </fieldset>    <script>        $.validator.addMethod("onlyLetterAndDigit",function(value, element, params){
            var regex=new RegExp('^[0-9a-zA-Z]+$');
            return regex.test(value);
        },"只能输入字母或数字");        $.validator.addMethod("onlyLetterAndDigites",function(value, element, params){
            var regex=new RegExp('^[0-9a-zA-Z]+$');
            return regex.test(value);
        },"只能输入字母或数字");        $(function () {
            $("#regForm").validate({
                submitHandler:function(form){
                    form.submit();
                }
            });            $("#addDom").click(function (event) {
                event.preventDefault();
                for ( var j = 0;j<3; j++ ) {
                    var Doms=$("#copyDom").clone();
                    $(Doms).css("display","block");
                    $(Doms).find("input[name='myname']").attr("id","myname"+j);
                    $(Doms).find("input[name='myadder']").attr("id","myadder"+j);
                    $("#addDoms").append(Doms);                }
                $("#regForm").validate();
                for(var i=0;i<3;i++){
                    $("#myname"+i).rules("add",{onlyLetterAndDigit:true,messages: {
                        required: "请输入内容"}});
                    $("#myadder"+i).rules("add",{onlyLetterAndDigites:true,messages: {
                        required: "请输入内容"}});
                    $("#regForm").validate();
                    console.info($("#myname"+i));
                    console.info("-----------"+i);                }
            })        })    </script>
</form>
</body>
</html>
效果如下:当点击新增下面会多出来几个控件只有第一个控件验证有效,其余几个验证都没有用!!