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

本文实例讲述了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}?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