简历登录界面

来源:互联网 发布:伦理网络法电影 编辑:程序博客网 时间:2024/06/05 08:44
<!doctype html><html><head><meta charset="utf-8"/><title>登录</title><style>.ok {color:green;border:1px solid green;}.error {color:red;border:1px solid red;}</style><script>//js中的方法默认都返回undefined//校验账号格式function check_acc() {//1.获取元素var input = document.getElementById("acc");var span = document.getElementById("acc_msg");//2.获取文本框的值var acc = input.value;//3.校验其格式var reg = /^\w{6,12}$/;if(reg.test(acc)) {//对了,增加正确的样式span.className = "ok";return true;} else {//错了,增加错误的样式span.className = "error";return false;}}//校验密码格式function check_pwd() {//1.获取元素var input = document.getElementById("pwd");var span = document.getElementById("pwd_msg");//2.获取密码框的值var pwd = input.value;//3.校验密码格式var reg = /^\w{8,20}$/;if(reg.test(pwd)) {//对了,加正确样式span.className = "ok";return true;} else {//错了,加错误样式span.className = "error";return false;}}</script></head><body><form action="http://www.baidu.com"onsubmit="return check_acc()+check_pwd()==2;"><p>账号:<input type="text" id="acc"onblur="check_acc();"/><span id="acc_msg">6-12位字母、数字、下划线的组合</span></p><p>密码:<input type="password" id="pwd"onblur="check_pwd();"/><span id="pwd_msg">8-20位字母、数字、下划线的组合</span></p><p><input type="submit" value="登录"/></p></form></body></html>


0 0