點擊會員名沒有效果為什么
按照老師的代碼編寫，第一個會員名onfocus就顯示不出來，看了好幾遍也沒看出來原因。還有個問題就是name_msg.innerHTML，這部分內(nèi)容html里面不是有嗎？為什么還要在js中再寫一遍呢？求教求教。
html部分
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表單驗證</title>
<link href="css/style.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
? <form>
? ? <div>
? ? ? <label><span>會員名：</span><input type="text" class="text"/></label>
? ? ? <p class="msg"><i class="ati"></i>5-25個字符，一個漢字為兩個字符，推薦使用中文會員名</p>
? ? </div>
? ? <div>
? ? ? <label><span></span><b id="count">0個字符</b></label>
? ? </div>
? ? <div>
? ? ? <label>
? ? ? ? <span>登錄密碼：</span><input type="password" class="text"/>
? ? ? </label>
? ? ? <p class="msg"><i class="err"></i>5-25個字符，一個漢字為兩個字符，推薦使用中文會員名</p>
? ? </div>
? ? <div style="margin:3px 0 10px 0">
? ? ? <label>
? ? ? ? <span></span>
? ? ? ? <em class="active">弱</em><em>中</em><em>強</em>
? ? ? </label>
? ? </div>
? ? <div style="margin-bottom:20px">
? ? ? <label>
? ? ? ? <span>確認(rèn)密碼:</span>
? ? ? ? <input type="password" class="text" disabled=""/>
? ? ? </label>
? ? ? <p class="msg"><i class="ati"></i>請再輸入一次</p>
? ? </div>
? ? <div>
? ? ? <label>
? ? ? ? <span> 驗證碼：</span><input type="text" class="text" style="width:50px"/>
? ? ? ? <img src="images/get_img.jpg" width="100" height="30"/><a class="changeimg" href="javascript:;" title="重新獲取驗證碼"></a>
? ? ? </label>
? ? </div>
? ? <div>
? ? ? <input class="submitBtn btn" type="submit" value="同意協(xié)議并注冊"/>
? ? </div>
? </form>
</body>
</html>
CSS部分
@charset "utf-8";
/*reset*/
*{
margin:0;
? ? padding:0;
font:12px/1.5 "宋體",“Arial”,"sans-serif","Tahoma";
color:#666;
}
img{
border:none;
}
input,img,label{
vertical-align:middle;
}
input:focus,textarea:focus{
outline:none;
}
.btn{border:none 0;}
.mb10{margin-bottom:10px;}
/*main*/
form{
width:740px;
height:500px;
margin:100px auto;
}
form div{
overflow:hidden;
clear:both;
}
form div label{
float:left;
clear:both;
}
form div label .text{
width:152px;
height:26px;
padding:0 2px;
border:1px solid #ccc;
}
form div label b{
font-weight:normal;
font-size:12px;
color:#ccc;
visibility:hidden;
}
form div em{
display:inline-block;
font-size:12px;
text-align:center;
color:#fff;
vertical-align:middle;
font-style:normal;
width:53px;
height:15px;
line-height:15px;
background:#ffd099;
}
form div .active{
background-color:#ff6600;
}
div span{
display:inline-block;
width:80px;
text-align:right;
}
.submitBtn{
width:135px;
height:33px;
background:url(/images/sprite.png);
color:#fff;
margin:20px 0 0 80px;
}
.changeImg{
width:22px;
height:22px;
display:inline-block;
vertical-align:middle;
background:url(../imges/sprite.png)no-repeat 0-128px
}
.msg{
line-height:12px;
color:#999;?
float:left;?
margin-left:5px;?
display:none;
}
.msg i{
display:inline-block;?
vertical-align:middle;?
width:25px; height:20px;?
background:url(../images/sprite.png)no-repeat;
}
.msg .ati{
background-position:0-71px;
}
.msg .err{
background-position:0-39px;
}
.msg .ok{
background-position:0-99px;
}
js部分
// JavaScript Document
window.onload=function(){
var aInput=document.getElemntsByTagname('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.getElemntsByTagName('em');
var re=/[^\w\u4e00-u9fa5]/g;
oName.onfocus=function(){
name_msg.style.display="block";
name_msg.innerHTML='<i class="ati"></i>5-25個字符，一個漢字為兩個字符，推薦使用中文會員名。'
}
oName.onkeyup=function(){
}
oName.onblur=function(){
}
}
2016-11-30
var?aInput=document.getElemntsByTagname('input');這句代碼寫錯了，應(yīng)該是var aInput=document.getElementsByTagName("input");
注意區(qū)分大小寫
ame('input');
還有個問題就是name_msg.innerHTML，這部分內(nèi)容html里面不是有嗎？為什么還要在js中再寫一遍呢？//都是一樣的，沒有對錯之分
2016-11-30
var?aInput=document.getElemntsByTagname('input');這句代碼寫錯了，應(yīng)該是var aInput=document.getElementsByTagname('input');
還有個問題就是name_msg.innerHTML，這部分內(nèi)容html里面不是有嗎？為什么還要在js中再寫一遍呢？//都是一樣的，沒有對錯之分