题目：写一个用于登录的表单，包含用户名、密码和手机号码。提交数据的时候，要求验证：
1. 用户名必须输入汉字；
2. 密码总共6位，前2位为字母，后4位为数字；
3. 手机号码符合中国大陆手机号码格式
如果输入错误，则在输入框后面显示对应的文本提示信息
代码如下：
<html><head><meta charset="UTF-8"><title></title></head><script>//1.当失去焦点时,用户名校验函数function checkUserName(){//1.1 获取到usernameID对应的input元素节点和username对应的校验span元素节点var usernameNode = document.getElementById("usernameID");var usernameCheckNode = document.getElementById("usernameCheckID");//1.2 定义校验正则var usernameReg = /^[\u4e00-\u9fa5]+$/ig;//1.3 获取到username元素节点的value属性值var usernameValue = usernameNode.value;//1.4 判断value属性值是否匹配正则并进行相关处理if (usernameReg.test(usernameValue)) {usernameCheckNode.innerText = "用户名输入成功！"; //当用户名输入成功时候的校验结果usernameCheckNode.style.color = "green";return true;} else{usernameCheckNode.innerText = "用户名输入失败！请输入中文用户名"; //当用户名输入失败时候的校验结果usernameCheckNode.style.color = "red";return false;}}//2.当失去焦点时,密码校验函数function checkPassword(){//2.1 获取到passwordID对应的input元素节点和password对应的校验span元素节点var passwordNode = document.getElementById("passwordID");var passwordCheckNode = document.getElementById("passwordCheckID");//2.2 定义校验正则var passwordReg = new RegExp("^[a-zA-Z]{2}[0-9]{4}$","ig");//2.3 获取到password元素节点的value属性值var passwordValue = passwordNode.value;//2.4 判断value属性值是否匹配正则并进行相关处理if (passwordReg.test(passwordValue)) {passwordCheckNode.innerText = "密码输入成功！"; //当密码输入成功时候的校验结果passwordCheckNode.style.color = "green";return true;} else{passwordCheckNode.innerText = "密码输入失败！密码为6位，前两位为英文字母，后四位为数字"; //当密码输入失败时候的校验结果passwordCheckNode.style.color = "red";return false;}}//3.当失去焦点时,手机号校验函数function checkPhoneNumber(){//3.1 获取到phoneID对应的input元素节点和phoneNumber对应的校验span元素节点var phoneNode = document.getElementById("phoneID");var phoneCheckNode = document.getElementById("phoneCheckId");//3.2 定义校验正则var phoneReg = /^1[0-9]{10}$/ig;//3.3 获取到phoneNumber元素节点的value属性值var phoneValue = phoneNode.value;//3.4 判断value属性值是否匹配正则并进行相关处理if (phoneReg.test(phoneValue)) {phoneCheckNode.innerText = "手机号输入成功！"; //当手机号输入成功时候的校验结果phoneCheckNode.style.color = "green";return true;} else{phoneCheckNode.innerText = "手机号输入失败！请输入中国大陆手机号码"; //当手机号输入失败时候的校验结果phoneCheckNode.style.color = "red";return false;}}//4.定义整体提交数据校验函数function checkInput(){if (checkUserName() && checkPassword() && checkPhoneNumber()) {alert("恭喜注册成功！");return true;} else{return false;}}</script><body><form id="loginID" name="login" action="submit.html" method="get" onsubmit="return checkInput()">用户名：<input type="text" id="usernameID" name="username" placeholder="请输入中文用户名" onblur="checkUserName()"/><span id="usernameCheckID"></span> <br />密码：<input type="password" id="passwordID" name="password" placeholder="密码为6位，前两位为英文字母，后四位为数字" onblur="checkPassword()"/><span id="passwordCheckID"></span> <br />手机号码：<input type="text" id="phoneID" name="phoneNumber" placeholder="请输入中国大陆手机号" onblur="checkPhoneNumber()"/><span id="phoneCheckId"></span><br /><input type="submit" name="submit"/><input type="reset"/></form></body></html>
第一次在博客写东西，可能有很多写得不对的地方，欢迎点评~
用javascript写一个简单的登录表单 包含用户名 密码和手机号码。提交数据时验证用户名 密码和手机号输入格式。
