码迷,mamicode.com
首页 > Web开发 > 详细

20151222jquery学习笔记--验证注册表单

时间:2015-12-22 23:03:09      阅读:249      评论:0      收藏:0      [点我收藏+]

标签:

$(function () {

	$(‘#search_button‘).button({
		icons : {
			primary : ‘ui-icon-search‘,
		},
	});
	

	$(‘#reg‘).dialog({
		autoOpen : true,
		modal : true,
		resizable : false,
		width : 320,
		height : 340,
		buttons : {
			‘提交‘ : function () {
				$(this).submit();
			}
		}
	}).buttonset().validate({
	
		submitHandler : function (form) {
			alert(‘验证成功,准备提交中。。‘);
		},
	
		showErrors : function (errorMap, errorList) {
			var errors = this.numberOfInvalids();
			
			if (errors > 0) {
				$(‘#reg‘).dialog(‘option‘, ‘height‘, errors * 20 + 340);
			} else {
				$(‘#reg‘).dialog(‘option‘, ‘height‘, 340);
			}
			
			this.defaultShowErrors();
		},
		
		highlight : function (element, errorClass) {
			$(element).css(‘border‘, ‘1px solid #630‘);
		},
		
		unhighlight : function (element, errorClass) {
			$(element).css(‘border‘, ‘1px solid #ccc‘);
			$(element).parent().find(‘span‘).html(‘ ‘).addClass(‘succ‘);
		},
	
		errorLabelContainer : ‘ol.reg_error‘,
		wrapper : ‘li‘,
	
		rules : {
			user : {
				required : true,
				minlength : 2,
			},
			pass : {
				required : true,
				minlength : 6,
			},
			email : {
				required : true,
				email : true
			},
			date : {
				date : true,
			},
		},
		messages : {
			user : {
				required : ‘帐号不得为空!‘,
				minlength : jQuery.format(‘帐号不得小于{0}位!‘),
			},
			pass : {
				required : ‘密码不得为空!‘,
				minlength : jQuery.format(‘密码不得小于{0}位!‘),
			},
			email : {
				required : ‘邮箱不得为空!‘,
				minlength : ‘请输入正确的邮箱地址!‘,
			},	
		}
	});
	
	$(‘#date‘).datepicker({
		changeMonth : true,
		changeYear : true,
		yearSuffix : ‘‘,
		maxDate : 0,
		yearRange : ‘1950:2020‘,

	});
		
	
	$(‘#email‘).autocomplete({
		delay : 0,
		autoFocus : true,
		source : function (request, response) {
			//获取用户输入的内容
			//alert(request.term);
			//绑定数据源的
			//response([‘aa‘, ‘aaaa‘, ‘aaaaaa‘, ‘bb‘]);
			
			var hosts = [‘qq.com‘, ‘163.com‘, ‘263.com‘, ‘sina.com.cn‘,‘gmail.com‘, ‘hotmail.com‘],
				term = request.term,		//获取用户输入的内容
				name = term,				//邮箱的用户名
				host = ‘‘,					//邮箱的域名
				ix = term.indexOf(‘@‘),		//@的位置
				result = [];				//最终呈现的邮箱列表
				
				
			result.push(term);
			
			//当有@的时候,重新分别用户名和域名
			if (ix > -1) {
				name = term.slice(0, ix);
				host = term.slice(ix + 1);
			}
			
			if (name) {
				//如果用户已经输入@和后面的域名,
				//那么就找到相关的域名提示,比如bnbbs@1,就提示bnbbs@163.com
				//如果用户还没有输入@或后面的域名,
				//那么就把所有的域名都提示出来
				
				var findedHosts = (host ? $.grep(hosts, function (value, index) {
						return value.indexOf(host) > -1
					}) : hosts),
					findedResult = $.map(findedHosts, function (value, index) {
					return name + ‘@‘ + value;
				});
				
				result = result.concat(findedResult);
			}
			
			response(result);
		},	
	});
	

});

  

20151222jquery学习笔记--验证注册表单

标签:

原文地址:http://www.cnblogs.com/xiaoduc-org/p/5068330.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!