1、表单验证的必要性:
由于操作表单的人有所不同,输入的数据就难免有不规范的时候,所以有必要规范输入格式。
数据输入的不规范导致后期管理上数据重复或不规范等等一系列的问题,因此对输入数据
进行验证就可以很好的避免一些不必要的麻烦了。
2、js代码:
<script type="text/javascript">
$(document).ready(function(){
$("#email").blur(function(){
$("#user_name").val(($(this).val().split("@"))[0]);
});
});
//注册表单验证
$(function(){
$('#register_form').validate({
errorPlacement: function(error, element){
var error_td = element.parent('td').next('td');
error_td.find('.field_notice').hide();
error_td.append(error);
},
success : function(label){
label.addClass('validate_right').text('OK!');
},
onkeyup: false,
rules : {
user_name : {
required : true,
byteRange: [3,25,'gbk'],
remote : {
url :'index.php?app=member&act=check_user&ajax=1',
type:'get',
data:{
user_name : function(){
return $('#user_name').val();
}
},
beforeSend:function(){
var _checking = $('#checking_user');
_checking.prev('.field_notice').hide();
_checking.next('label').hide();
$(_checking).show();
},
complete :function(){
$('#checking_user').hide();
}
}
},
password : {
required : true,
minlength: 6
},
password_confirm : {
required : true,
equalTo : '#password'
},
email : {
required : true,
email : true,
remote : {
url :'index.php?app=member&act=check_email&ajax=1',
type:'get',
data:{
email : function(){
return $('#email').val();
}
},
beforeSend : function(){
var _checking = $('#checking_email');
_checking.prev('.field_notice').hide();
_checking.next('label').hide();
$(_checking).show();
},
complete : function(){
$('#checking_email').hide();
}
}
},
mobile :{
minlength: 11,
maxlength: 12
},
captcha : {
required : true,
remote : {
url : 'index.php?app=captcha&act=check_captcha',
type: 'get',
data:{
captcha : function(){
return $('#captcha1').val();
}
}
}
},
agree : {
required : true
}
},
messages : {
user_name : {
required : '您必须提供一个用户名',
byteRange: '用户名必须在3-25个字符之间',
remote : '您提供的用户名已存在'
},
password : {
required : '您必须提供一个密码',
minlength: '密码长度应在6-20个字符之间'
},
password_confirm : {
required : '您必须再次确认您的密码',
equalTo : '两次输入的密码不一致'
},
email : {
required : '您必须提供您的电子邮件',
email : '这不是一个有效的电子邮件地址',
remote : '您提供的email已经存在'
},
mobile : {
minlength: '请输入正确的11位数的手机号码',
maxlength: '请输入正确的11位数的手机号码'
},
captcha : {
required : '请输入右侧图片中的文字',
remote : '验证码错误'
},
agree : {
required : '您必须阅读并同意该协议,否则无法注册'
}
}
});
});
</script>
注:大多数代码基本都一样写法也类似,代码不是自己写的摘抄自: