html5表单验证

jQuery Validate学习网址
挺好用的一款插件,可以自定义验证方法

$("#form_details").validate({
        rules:{
            my_name:{
                required: true
            },
            tel:{
                required: true,
                check_tel: true
            },
            my_id:{
                required: true,
                check_my_id: true
            },
            my_address:{
                required: true
            },
            zip_code:{
                required: true,
                check_zip_code: true
            },
            site_address:{
                required: true
            },
            game:{
                required: true
            },
            agree_rules:{
                required: true
            },
            my_date:{
                required: true
            },
            my_place:{
                required: true
            },
            site_id:{
                required: true,
                check_site_id: true
            },
            fault_details:{
                required: true
            },
            change_code:{
                required: true
            },
            group_num:{
                required: true,
                min: 2
            },
            img_num:{
                required: true
            }
        },
        messages:{
            my_name:{
                required: "请输入姓名"
            },
            tel:{
                required: "请输入电话号码"
            },
            my_id:{
                required: "请输入身份证号码"
            },
            my_address:{
                required: "请输入通信地址"
            },
            zip_code:{
                required: "请输入邮箱"
            },
            site_address:{
                required: "请输入要申请的网点地址"
            },
            game:{
                required: "请选择申请销售游戏类型"
            },
            agree_rules:{
                required: "您尚未同意相关条款"
            },
            my_date:{
                required: "请选择时间"
            },
            my_place:{
                required: "请填写通讯地址"
            },
            site_id:{
                required: "请填写网点号"
            },
            fault_details:{
                required: "请描述故障情况"
            },
            change_code:{
                required: "请输入兑换码"
            },
            group_num:{
                required: "请输入团体人数",
                min: "团体人数至少为2人"
            },
            img_num:{
                required: "请上传相关图片"
            }
        },
        errorPlacement: function (error, element) { //指定错误信息位置
            if (element.is(':radio') || element.is(':checkbox')) { //如果是radio或checkbox
                var eid = element.attr('name'); //获取元素的name属性
                error.appendTo(element.parent()); //将错误信息添加当前元素的父结点后面
            } else {
                error.insertAfter(element);
            }
        }
    });

你可能感兴趣的:(前端学习资源推荐)