jquery实现表单验证简单实例演示

/*
描述：基于jquery的表单验证插件。
*/

(function ($) {
 $.fn.checkForm = function (options) {
  var root = this; //将当前应用对象存入root

  var isok = false; //控制表单提交的开关

  var pwd1; //密码存储

  var defaults = {
   //图片路径
   img_error: "img/error.gif",
   img_success: "img/success.gif",

   //提示信息
   tips_success: '', //验证成功时的提示信息，默认为空
   tips_required: '不能为空',
   tips_email: '邮箱地址格式有误',
   tips_num: '请填写数字',
   tips_chinese: '请填写中文',
   tips_mobile: '手机号码格式有误',
   tips_idcard: '身份证号码格式有误',
   tips_pwdequal: '两次密码不一致',

   //正则
   reg_email: /^\w+\@[a-zA-Z0-9]+\.[a-zA-Z]{2,4}$/i, //验证邮箱
   reg_num: /^\d+$/,         //验证数字
   reg_chinese: /^[\u4E00-\u9FA5]+$/,     //验证中文
   reg_mobile: /^1[3458]{1}[0-9]{9}$/,    //验证手机
   reg_idcard: /^\d{14}\d{3}&＃63;\w$/      //验证身份证
  };

  //不为空则合并参数
  if(options)
   $.extend(defaults, options);

  //获取（文本框，密码框，多行文本框），当失去焦点时，对其进行数据验证
  $(":text,:password,textarea", root).each(function () {
   $(this).blur(function () {
    var _validate = $(this).attr("check"); //获取check属性的值
    if (_validate) {
     var arr = _validate.split(' '); //用空格将其拆分成数组
     for (var i = 0; i " + msg + "";
   if (mark)
    _html = "" + msg + "";
   $(obj).after(_html);//再添加
   return mark;
  }
 }
})(jQuery);

 


 
  

   

   邮箱：
   
   

   密码：
   
   

   确认密码：
   
   

   手机：
   
   

   数字：
   
   

   地址：
   
   

   不加check验证的文本框：