JS实践
使用JS实现一个注册页面
知识点:
* 正则表达式:
*
* 正则表达式是对于数据格式进行一定的规范限制
*
*
* ^:开始
* [0-9] [a-z A-Z] :数字 字母
*
* {2,4} :段域 至少是2位 最多是4位
* {3}:指定范围就是3位
* {2,}:至少是2位
* $:结束
*
* \d:[0-9]
*
* \w[0-9 a-z A-Z]
* add{3} 最后一个d连续出现3次
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script>
/**************抽取公共的检测文字是否合法的部分代码****************/
function check(id,reg){
//获得输入框的值
var uname = document.getElementById(id);
//获得alt属性
var alt = uname.alt;
//获得value属性
var val = uname.value;
//获得span的对象
var span = document.getElementById(id+"_span");
//输入内容的正则表达式规范
//var reg=/^[\u4e00-\u9fa5]{3,5}$/;
//规定名称的格式
if(val==null||val==""){
span.innerText="X"+alt+"不可以为空";
span.style.color="red";
return false;
}else if(reg.test(val)){
span.innerText=alt+"符合规范";
span.style.color="deepskyblue";
return true;
}else{
span.innerText=alt+"不符合规范";
span.style.color="red";
return false;
}
}
//校验用户名的操作
function checkName(){
//汉字的正则表达式 --{3,5}这是三到五位的意思; [\u4e00-\u9fa5]这是汉字编码;^是开始的意思;$是结束的意思
var reg=/^[\u4e00-\u9fa5]{3,5}$/;
return check("uname",reg);
}
//校验密码的方法
function checkPwd(){
//密码的格式正则表达式
var reg = /^[0-9]{3,8}$/;
return check("pwd",reg);
}
//校验电话号
function checkPhone(){
var reg = /^[0-9]{7,11}$/;
return check("phone",reg);
}
//校验邮箱
function checkEmail(){
//邮箱的正则表达式
var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
return check("email",reg);
}
//性别校验
function checkSex(){
//获得所有的性别对象
var sex = document.getElementsByName("sex");
//获得span对象
var span = document.getElementById("sex_span");
for(var i in sex){
//如果两个选项有一个被选择
if(sex[i].checked){
span.innerText="性别选择成功";
span.style.color="deepskyblue";
return true;
}
}
span.innerText="请选择性别";
span.style.color="red";
return false;
}
//籍贯的校验
function checkAdress(){
var sel = document.getElementById("sel").value;
var span = document.getElementById("sel_span");