照着写没效果
var dome1=document.getElementsByTagName('input');var sp=document.getElementsByTagName('span');dome1.onfocus=function(){sp.style.display="block";sp.innerHTML='5-25个字符,一个中文表示两个字符';}会员名我这样写,没有效果,求看看问题在哪
var dome1=document.getElementsByTagName('input');var sp=document.getElementsByTagName('span');dome1.onfocus=function(){sp.style.display="block";sp.innerHTML='5-25个字符,一个中文表示两个字符';}会员名我这样写,没有效果,求看看问题在哪
2016-08-16
*{margin: 0;padding: 0;list-style: none;text-decoration: none;font-family: "微软雅黑";}
form {
float: left;
width: 840px;
height: 500px;
margin: 200px 600px;
}
.count{color: gainsboro;display: none;}
form div{clear: left;}
form p{font-size: 12px;line-height: 30px;}
.msg{float: left;display: none;}
form input{float: left;display: inline-block;width: 200px;height: 30px;outline: #fff;}
form span{text-align: right;display: inline-block;width: 100px;float: left;line-height: 30px;}
form em{width:65px;height: 20px;display: inline-block;text-align: center;background-color: #f8b875;margin-right: 2px;line-height: 20px;margin: 10px 2px;color: #fde7bf;}
.active{background-color: #ee5f18;}
.submit_btn{width: 200px;height: 50px;background-color: #ee5f18;color: #fde7bf;text-align: center;line-height: 50px;font-size: 16px;}
这是我初步写的 还有点小问题 正在改正
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="new_file.css"/>
</head>
<body>
<form>
<div><lable><span class="span1">会员名:</span><input type="text" class="text" /><p class="msg"><i class="ati"></i> 5到25个字符,一个汉字为两个字符,推荐使用中文会员名</p></lable></div>
<div><lable><span style="width: 120px;height: 30px;"></span><b class="count">0个字符</b></lable></div>
<div><lable><span class="span1">登录密码:</span><input type="text" class="text" /><p class="msg"><i class="ati"></i> 5到25个字符,一个汉字为两个字符,推荐使用中文会员名</p></lable></div>
<div><lable><em class="active" style="margin-left: 100px;">弱</em><em>中</em><em>强</em></lable></div>
<div style="margin-bottom: 20px;"><lable><span class="span1">确认密码:</span><input type="text" class="text" /><p class="msg"><i class="ati"></i> 请再确认一遍</p></lable></div><br /><br />
<div><lable><span class="span1">验证码:</span><input type="text" class="text" style="width: 90px;"/></lable></div>
<div style="margin: 70px 100px;clear: left;"><lable><input type="submit" name="" class="submit_btn" value="同意协议并注册" /></lable></div>
</form>
<script>
function getLength(str){
return str.replace(/[^\x00-\xff]/g,"xx").length;
}
function findStr(str,n){
var tmp=0;
for(i=0;i<str.length;i++){
if(str.charAt(i)==n){
tmp++;
}
}
return tmp;
}
window.onload=function(){
var aInput=document.getElementsByTagName('input');
var oName=aInput[0];
var pwd=aInput[1];
var pwd2=aInput[2];
var aP=document.getElementsByTagName('p');
var name_msg=aP[0];
var pwd_msg=aP[1];
var pwd2_msg=aP[2];
var count=document.getElementById('count');
var aEm=document.getElementsByTagName('em');
var name_length=0;
/*var str="akacakfff";
var re=/(a[a-g]){2}/i;
alert(re.test(str));*/
//数字 字母(不分大小写) 汉字 下划线
//5到25个字符 推荐使用中文字符
var re=/\w\ue400-\u9fa5/g;
//用户名
oName.onfocus=function(){
name_msg.style.display="block";
name_msg.innerHTML='<i class="ati"></i>输入5到25个字符,推荐使用中文会员名';
}
oName.onkeyup=function(){
count.style.visibility="visible";
name_length=getLength(this.value);
count.innerHTML='name_length+"个字符"';
if(name_length==0){
count.style.visibility="hidden";
}
}
oName.onblur=function(){
var re=/^\w\ue400-\u9fa5/g;
if(re.test(this.value)){
name_msg.innerHTML='含有非法字符';
}
else if(name_length=""){
name_msg.innerHTML='不能为空';
}
else if(name_length>25){
name_msg.innerHTML='长度不能超过25个字符';
}
else if(name_length<6){
name_msg.innerHTML='长度不能小于6个字符';
}
else{
name_msg.innerHTML='OK!';
}
}
pwd.onfocus=function(){
pwd_msg.style.display='block';
pwd_msg.innerHTML='6-16个字符,请使用字母加数字加符号的组合密码,不能单独使用数字,字母或符号';
}
pwd.onkeyup=function(){
if(this.value.length>5){
aEm[1].className="active";
pwd2.removeAttribute("disabled");
pwd2_msg.style.display='block';
}
else{
aEm[1].className="";
pwd2.setAttribute("disabled");
pwd2_msg.style.display="none";
}
if(this.value.length>10){
aEm[2].className="active";
pwd2.removeAttribute("disabled");
pwd2_msg.style.display='block';
}
else{
aEm[2].className="";
/*pwd2.setAttribute("disabled");
pwd2_msg.style.display="none";*/
}
}
pwd.onblur=function(){
var m=findStr(pwd.value,pwd.value[0]);
var re_n=/[^\d]/g;
var re_t=/[^a-zA-Z]/g;
if(this.value==""){
pwd_msg.innerHTML='不能为空';
}
else if(m==this.value.length){
pwd_msg.innerHTML='不能使用相同字符';
}
else if(this.value.length<6||this.value.length>25){
pwd_msg.innerHTML='字符应在6到25之间';
}
else if(!re_n.test(this.value)){
pwd_msg.innerHTML='不能全为数字';
}
else if(!re_t.test(this.value)){
pwd_msg.innerHTML='不能全为字母';
}
else{
pwd_msg.innerHTML='OK!';
}
}
pwd2.onblur=function(){
if(this.value!=pwd.value){
pwd2_msg.innerHTML='两次输入的不一致';
}
else{
pwd2_msg.innerHTML='OK!';
}
}
}
</script>
</body>
</html>
举报