标签：red 账号 top 数字 字母 log 页面 成功 lang
完成登录与注册页面的HTML+CSS+JS，其中的输入项检查包括：
用户名6-12位
首字母不能是数字
只能包含字母和数字
密码6-12位
注册页两次密码是否一致
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录</title> <link rel="stylesheet"type="text/css"href="../static/css/111.css"> <script src="../static/js/111.js"></script> </head> <body> <div class="aa" > <div class="login" ><h2>登录</h2></div> <div class="aa1" > 账号：<input id="name" type="text"placeholder="请输入用户名"><br> 密码：<input id="password" type="password"placeholder="请输入密码"><br> </div> <div id="error_box"><br></div> <div class="aa2" > <button onclick="myLogin()">登录</button> <button type="button" onclick=window.alert("是否取消登录！")>取消</button> </div> </body> </html>
div{ margin:0 auto; text-align:center; } .aa{ width:350px; height:200px; background-color: black; margin-top:100px; } .login{ font-size: 25px; color: red; font-family: 楷体; } .aa1{ font-size:16px; font-weight:bold; color: red; font-family: 楷体; } .aa2{ width:100px; height:30px; boder-style:hidden; font-family: 楷体; } #error_box{ color:red; }
function myLogin() { var oUname = document.getElementById("name") var oError = document.getElementById("error_box") var opassword = document.getElementById("password") oError.innerHTML = "<br>" if(oUname.value.length<6||oUname.value.length>12){ oError.innerHTML="用户名需为6-12位"; return; } else if ((oUname.value.charCodeAt(0)>=48) && oUname.value.charCodeAt(0)<=57){ oError.innerHTML="首字母不能是数字"; return; } else for(var i=0;i<oUname.value.length;i++){ if((oUname.value.charCodeAt(i)<48||oUname.value.charCodeAt(i)>57) && (oUname.value.charCodeAt(i)<97)||oUname.value.charCodeAt(i)>122){ oError.innerHTML="只能包含字母和数字"; return; } } if(opassword.value.length<6||opassword.value.length>12){ oError.innerHTML="密码需为6-12位"; return; } window.alert("登录成功！") }
标签：red 账号 top 数字 字母 log 页面 成功 lang
原文地址：http://www.cnblogs.com/xiepingjian/p/7768073.html
