分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

jquery的validate表单验证

发布时间:2023-09-06 01:21责任编辑:赖小花关键词:暂无标签

html:

<form id="reg" action="123.html">
<p class="myerror"></p>
<p>帐号:<input type="text" name="user" id="user" ?/></p>
<p>密码:<input type="text" name="pass" id="pass" /></p>
<p>邮编:<input type="text" name="code" id="code" /></p>
<p><input type="submit" value="提交" /></p>
</form>

css:(部分)

.valid {
  background:url(../img/reg_succ.png) no-repeat right;//图片为成功的
}

 js:

$(function () {

  //自定义验证规则
  $.validator.addMethod(
    "code",
    function(value,element){
      var tel=/^[0-9]{6}$/;
      return this.optional(element) || (tel.test(value));
    },
    "请输入正确的邮政编码!"
  );

  //插件验证
  $(‘#reg‘).validate({
    submitHandler : function (form) {
      alert(‘验证成功,准备提交!‘);
    },
    rules:{
      user:{
         required:true,
         minlength:6
      },
      pass:{
         required:true,
         minlength:6
      },
      code:{
        required:true,
        code:true
      }
    },
    messages:{
      user:{
        required:"用户名不为空!",
        minlength:"最小长度不少于6位"
      },
      pass:{
        required:"密码不为空!",
        minlength:"最小长度不少于6位"
      },
     code:{
       required:"邮箱不为空"
     }
   }
})
});

效果图:

jquery的validate表单验证

原文地址:http://www.cnblogs.com/zhihou/p/7760582.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved