//博客园注册页面
博客园注册页面table{
margin: 0 auto;
}
$(document).ready(function(){
//表单单击事件
$("#submit").click(function(){
var names=document.getElementById("name");//获取用户名
if(names.validity.valueMissing==true){
names.setCustomValidity("用户名不能为空");
}
else if(names.validity.patternMismatch==true){
names.setCustomValidity("用户名必须以英文开头4-16个英文字母或数字");
}
else{
names.setCustomValidity("");
}
var pwd=document.getElementById("pwd");//获取密码
if(pwd.validity.valueMissing==true){
pwd.setCustomValidity("密码不能为空");
}
else if(pwd.validity.patternMismatch==true){
pwd.setCustomValidity("密码必须4-10个英文字母或数字");
}
else{
pwd.setCustomValidity("");
}
var quepas=document.getElementById("quepwd");//确认密码
if(!quepas.equals(pwd)){
quepas.setCustomValidity("两次输入的密码不一致");
}
var email=document.getElementById("email");//获取邮箱
if(email.validity.valueMissing==true){
email.setCustomValidity("邮箱不能为空");
}
else if(email.validity.patternMismatch==true){
email.setCustomValidity("邮箱格式不正确");
}
else{
email.setCustomValidity("");
}
var phone=document.getElementById("phone");//获取手机号
if(phone.validity.valueMissing==true){
phone.setCustomValidity("手机号不能为空");
}
else if(phone.validity.patternMismatch==true){
phone.setCustomValidity("手机号只能是1开头的11位数字");
}
else{
phone.setCustomValidity("");
}
var bith=document.getElementById("bith");//获取生日
if(bith.validity.valueMissing==true){
bith.setCustomValidity("生日不能为空");
}
else if(bith.validity.patternMismatch==true){
bith.setCustomValidity("生日的年份为1900~2016,格式为1980-5-12或1988-02-04");
}
else{
bith.setCustomValidity("");
}
});
});
博客园
新用户注册
用户名: | pattern="[a-zA-Z][a-zA-Z0-9]{3,15}" id="name"/> |
密码: | pattern="[a-zA-Z0-9]{4,10}" id="pwd"/> |
确认密码: | |
电子邮箱: | pattern="\w+@\w+(\.[a-zA-Z]{2,3}){1,2}" id="email"/> |
手机号: | pattern="1\d{10}" id="phone"/> |
生日: | pattern="((19\d{2})|(201\d))-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])" id="bith"/> |
//
百度注册页面.reg-inpiut {
margin-top: 20px;
}
.input-label {
display: inline-block;
text-align: right;
width: 100px;
}
.reg-inpiut {
height: 30px;
line-height: 30px;
}
.reg-inpiut i {
color: #f00;
vertical-align: middle;
padding-right: 5px;
}
#tel-tip {
font-size: 12px;
color: #f00;
}
$(function(){
$("#submit").click(function(){
var uname=document.getElementById("uname");
var names=document.getElementById("names");
if(uname.validity.valueMissing==true){
//uname.setCustomValidity("用户名不能为空");
names.innerHTML="用户名不能为空";
}else if(uname.validity.patternMismatch==true){
//uname.setCustomValidity("英文,数字长度为4-12个字符");
names.innerHTML="英文,数字长度为4-12个字符";
}else{
//uname.setCustomValidity("");
names.innerHTML="ok";
}
var pwd=document.getElementById("pwd");//获取密码
var pwds=document.getElementById("pwds");
if(pwd.validity.valueMissing==true){
//pwd.setCustomValidity("密码不能为空");
pwds.innerHTML="密码不能为空";
}
else if(pwd.validity.patternMismatch==true){
//pwd.setCustomValidity("密码必须4-10个英文字母或数字");
pwds.innerHTML="密码必须4-10个英文字母或数字";
}
else{
//pwd.setCustomValidity("");
pwds.innerHTML="";
}
var quepas=document.getElementById("quepwdsss");//确认密码 (//这里总是无缘无故报错,我刚开始的时候是对的,但后来就不行了)
if(!quepas.equals(pwd)){
quepas.setCustomValidity("两次输入的密码不一致");
}
var email=document.getElementById("email");//电子邮件
var emsil=document.getElementById("emsil");
if(email.validity.valueMissing==true){
//email.setCustomValidity("邮箱不能为空");
emsil.innerHTML="邮箱不能为空";
}
else if(email.validity.patternMismatch==true){
//email.setCustomValidity("邮箱格式必须包含“@”和“.");
emsil.innerHTML="邮箱格式必须包含“@”和“.”";
}
else{
//email.setCustomValidity("");
emsil.innerHTML="";
}
var bith=document.getElementById("both");//获取生日
if(bith.validity.valueMissing==true){
bith.setCustomValidity("生日不能为空");
}
else if(bith.validity.patternMismatch==true){
bith.setCustomValidity("生日的年份为1900~2016,格式为1980-5-12或1988-02-04");
}
else{
bith.setCustomValidity("");
}
});
});
用户注册
*用户名:
pattern="\w{4,12}"/>
*密码:
pattern="[a-z-A-Z0-9]{6,12}"/>
*确认密码:
*性别:
男
女
请选择性别
*电子邮件:
pattern="\w+@\w+(\.[a-zA-Z]{2,3}){1,2}"/>
*出生日期:
pattern="((19\d{2})|(201\d))-(0?[1-9]|1[0-2])-(0?[1-9]|[1-2]\d|3[0-1])"/>