首页 web前端 js教程 分享jquery插件--表单验证

分享jquery插件--表单验证

Jun 19, 2017 am 10:50 AM
jquery 分享 插件 表单 验证

var regAction = (function () {
	var defaultOpts = {
		'regform' : 'regfrom',
		'username' : 'username',
		'userpwd' : 'userpwd',
		'confirmpwd' : 'confirmpwd',
		'checkcode' : 'checkcode',
		'accept' : 'accept',
		'errorTrips' : 'errorTrips',
		'channel' : 'channel',
		'loginAuto' : 'loginAuto',
		'btnAction' : 'btnAction'

	},
	isreg = 1;
	//去掉空格
	function trim(str) {
		return str.replace(//s+$|^/s+/g, '');
	}

	//检测email
	function isEmail(email) {
		return /^[/w/-/.]+@[/w/-/.]+(/./w+)+$/i.test(email)
	}

	//检测用户名
	function checkUserName(callback) {
		var optsObj = defaultOpts;
		var nameObj = optsObj.username;
		var errorTripsObj = optsObj.errorTrips;
		var value = trim(nameObj.val());
		nameObj.val(value);

		if (!isEmail(value)) {
			errorTripsObj.html('请输入正确的邮箱地址').css('visibility', 'visible');
			nameObj.focus();
			if (callback) {
				callback(false);
			}
		} else {
			$.ajax({
				url : '/index.php?ac=account&op=checkuser',
				dataType : 'json',
				type : 'post',
				data : {
					username : value
				},
				success : function (res) {
					if (res) {
						switch (res.string) {
						case '1':
							//errorTripsObj.html('该邮箱已经被注册').css('visibility', 'visible');
							optsObj.checkcode.hide();
							$("#jChkcode").hide();
							$("#jPrivacy").hide();
							$("#jRemeberBox").show();
							$("#repwd-box").hide();
							$("#jhd").text("登录快盘");
							$("#jcnt").text("随时随地查看文件");
							optsObj.btnAction.val("立即登录");
							isreg = 2;
							//nameObj.focus();
							if (callback) {
								//callback(false);
								callback(true);
							}
							nameObj.change(function () {
								optsObj.checkcode.show();
								$("#jChkcode").show();
								$("#jPrivacy").show();
								$("#jRemeberBox").hide();
								$("#repwd-box").show();
								$("#jhd").text("注册快盘");
								$("#jcnt").text("只需5秒,立即拥有15GB空间");
								optsObj.btnAction.val("立即注册");
								isreg = 1;
							});
							break;
						case '2':
						default:
							errorTripsObj.css('visibility', 'hidden');
							if (callback) {
								callback(true);
							}
						}
					} else {
						if (callback) {
							callback(true);
						}
					}
				}
			})
		}

	}
	//检测密码
	function checkPwd(callback) {
		var optsObj = defaultOpts;
		var userPwd = optsObj.userpwd;
		var username = optsObj.username;
		var confirmPwd = optsObj.confirmpwd;
		var errorTripsObj = optsObj.errorTrips;
		var loginAuto = optsObj.loginAuto;
		var len = trim(userPwd.val()).length;
		if (0 == len) {
			errorTripsObj.html('请填写登录密码').css('visibility', 'visible');
			userPwd.focus();
			return false;
		} else {
			if (len < 6 || len > 32) {
				errorTripsObj.html('密码应在6-32位字符内').css('visibility', 'visible');
				userPwd.focus();
				return false;
			} else {
				errorTripsObj.css('visibility', 'hidden');
				if (isreg === 1) {
					var reLen = trim(confirmPwd.val()).length;
					if (0 == reLen) {
						errorTripsObj.html('请填写重复登录密码').css('visibility', 'visible');
						confirmPwd.focus();
						return false;
					} else {
						if (userPwd.val() != confirmPwd.val()) {
							errorTripsObj.html('两次密码输入不一致').css('visibility', 'visible');
							confirmPwd.focus();
							return false;	
						} else {
							return true;
						}
					}
				} else {
					if (loginAuto.attr("checked") === "checked") {
						loginAuto.val("1");
					} else {
						loginAuto.val("0");
					}
					$.ajax({
						url : '/index.php?ac=account&op=login',
						type : 'post',
						dataType : 'json',
						data : {
							'username' : username.val(),
							'userpwd' : userPwd.val(),
							'rememberme' : loginAuto.val(),
							'isajax' : 'yes'
						},
						success : function (res) {
							if (res.state == 0) {
								errorTripsObj.html('用户名密码不匹配').css('visibility', 'visible');
								userPwd.focus();

								return false;
							} else {
								if(callback) {
									location.href = "/home.htm" ;
								}
							}
						}
					});
				}
			}
		}
	}

	//检测是否接受协议
	function checkAccpet() {
		var optsObj = defaultOpts;
		var acceptObj = optsObj.accept;
		var errorTripsObj = optsObj.errorTrips;
		if (acceptObj.attr('checked')) {
			return true;
		} else {
			errorTripsObj.html('请阅读并接受用户协议').css('visibility', 'visible');
			acceptObj.focus();
			return false;
		}
	}

	//验证码检测
	function checkCode() {
		var optsObj = defaultOpts;
		var checkcodeObj = optsObj.checkcode;
		var errorTripsObj = optsObj.errorTrips;
		if (checkcodeObj.length == 1 && "" == checkcodeObj.val()) {
			errorTripsObj.html('请输入验证码').css('visibility', 'visible');
			checkcodeObj.focus();
			return false;
		} else {
			return true;
		}
	}

	//注册表单提交
	function regFormSubmit(e, data) {
		checkUserName(function (f) {
			var result, checkPwdResult;
			if (isreg === 1) {
				defaultOpts.regform.attr("action", "/index.php?ac=account&op=registerhanlder");
				result = f && checkPwd() && checkAccpet() && checkCode();
				if (result) {
					defaultOpts.regform.unbind('submit').submit();
				}
			} else {
				checkPwd( f );
			}

		});
		if (!data) {
			return false;
		}
	}

	function bindEvent() {
		var optsObj = defaultOpts;
		optsObj.regform.submit($.proxy(regFormSubmit, this));
		optsObj.username.change(function () {
			checkUserName();
		})
		optsObj.userpwd.change($.proxy(checkPwd, this));
		if (isreg === 1) {
			optsObj.confirmpwd.change($.proxy(checkPwd, this));
		}
	}

	return {
		init : function (opts) {
			$.each(opts, function (i, n) {
				opts[i] = $("#" + n);
			});
			defaultOpts = $.extend(defaultOpts, opts);
			bindEvent();
		},
		checkEmailVlaue : function () {
			checkUserName();
		}
	};
})();
登录后复制
regAction.init({'regform':'regform','username':'email','errorTrips':'erroInfo','userpwd':'pwd','confirmpwd':'re-pwd','accept':'chkaccpet','checkcode':'checkcode','loginAuto':'login-auto','btnAction':'jAction'});//初始化
登录后复制

以上是分享jquery插件--表单验证的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它们
4 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

夸克网盘怎么分享到百度网盘? 夸克网盘怎么分享到百度网盘? Mar 14, 2024 pm 04:40 PM

  夸克网盘和百度网盘都是很便利的存储工具,不少的用户们都在询问这两款软件互通吗?夸克网盘怎么分享到百度网盘?下面就让本站来为用户们来仔细的介绍一下夸克网盘的文件怎么保存到百度网盘方法吧。  夸克网盘的文件怎么保存到百度网盘方法  1、想要知道怎么把夸克网盘的文件转到百度网盘,首先在夸克网盘上下载需要保存的文件,然后打开百度网盘客户端后,选择压缩文件要保存的文件夹,双击打开该文件夹。  2、打开该文件夹后,点击窗口左上角区域的“上传”。  3、在电脑中找到需要上传的压缩文件,点击选

微信好友辅助验证进行解封的详细方法 微信好友辅助验证进行解封的详细方法 Mar 25, 2024 pm 01:26 PM

1、打开微信进入后,点击搜索图标,输入微信团队,点击下方的服务进入。2、进入后,点击左下方的自助工具的选项。3、点击后,在上方的选项内,点击解封/申诉辅助验证的选项。

网易云音乐怎么分享到微信朋友圈_网易云音乐分享到微信朋友圈教程 网易云音乐怎么分享到微信朋友圈_网易云音乐分享到微信朋友圈教程 Mar 25, 2024 am 11:41 AM

1、首先我们进入到网易云音乐中,然后在软件首页界面中,点击进入到歌曲的播放界面中。2、然后在歌曲播放界面中,找到右上方的分享功能按钮,如下图红框所示位置,点击选择分享的渠道;在分享渠道中,点击底部的“分享至”选项,然后选择第一个“微信朋友圈”,即可将内容分享至微信朋友圈。

Chrome的插件扩展程序安装目录是什么 Chrome的插件扩展程序安装目录是什么 Mar 08, 2024 am 08:55 AM

Chrome的插件扩展程序安装目录是什么?正常情况下,Chrome插件扩展程序的默认安装目录如下:1、windowsxp中chrome插件默认安装目录位置:C:\DocumentsandSettings\用户名\LocalSettings\ApplicationData\Google\Chrome\UserData\Default\Extensions2、windows7中chrome插件默认安装目录位置:C:\Users\用户名\AppData\Local\Google\Chrome\User

分享Edge浏览器不支持此插件的三种解决办法 分享Edge浏览器不支持此插件的三种解决办法 Mar 13, 2024 pm 04:34 PM

  用户使用Edge浏览器的过程中可能会添加一些插件来满足自己更多的使用需求。但是在添加插件时显示不支持此插件,这该如何解决?今日小编就来给大家分享三种解决办法,快来试试吧。  方法一:尝试用其他的浏览器。  方法二:浏览器上的FlashPlayer可能过时或者丢失,导致此插件不受支持状态,可在官网下载最新版本。  方法三:同时按下“Ctrl+Shift+Delete”键。  点击“清除数据”,重新打开浏览器即可。

百度网盘怎么分享文件给好友 百度网盘怎么分享文件给好友 Mar 25, 2024 pm 06:52 PM

近期,百度网盘安卓客户端迎来了全新的8.0.0版本,这一版本不仅带来了众多变化,还增添了诸多实用功能。其中,最为引人注目的便是文件夹共享功能的增强。现在,用户可以轻松邀请好友加入,共同分享工作和生活中的重要文件,实现更加便捷的协作与共享。那么究竟该如何分享给好友自己需要分享的文件呢,下文中本站小编就将为大家带来详细内容介绍,希望能帮助到大家!1)打开百度云APP,首先点击在首页中选择相关的文件夹,然后再点击界面右上角的【...】图标;(如下图)2)随后点击“共享成员”一栏中的【+】,最后在勾选所

PHP 8 新特性:增加了验证和签名 PHP 8 新特性:增加了验证和签名 Mar 27, 2024 am 08:21 AM

PHP8是PHP的最新版本,为程序员带来了更多的便利和功能。这个版本特别关注安全性和性能,其中一个值得注意的新特性是增加了验证和签名功能。在本文中,我们将深入了解这些新的功能及其用途。验证和签名是计算机科学中非常重要的安全概念。它们通常用于确保传输的数据是完整和真实的。在处理在线交易和敏感信息时,验证和签名变得尤为重要,因为如果有人能够篡改数据,可能会对

解决Discuz微信分享无法显示的问题 解决Discuz微信分享无法显示的问题 Mar 09, 2024 pm 03:39 PM

标题:解决Discuz微信分享无法显示的问题,需要具体代码示例随着移动互联网的发展,微信成为了人们日常生活中不可或缺的一部分。在网站开发中,为了提升用户体验和扩大网站的曝光度,很多站点会集成微信分享功能,让用户能够方便地分享网站的内容到朋友圈或者微信群中。然而,有时候在使用Discuz等开源论坛系统时,会遇到微信分享无法显示的问题,这给用户体验带来了一定的困

See all articles