老师，我这里的问题是什么？
来源：4-8 编程练习
慕用0863198
2019-07-18 07:33:42
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{
margin:0;
padding: 0;
}
.wrapper{
width: 800px;
height: 600px;
margin: 100px auto;
}
.wrapper header{
width: 100%;
height: 40px;
color: white;
background-color: #6495ED;
}
.wrapper header p{
line-height: 40px;
font-size: 20px;
padding-left: 10px;
}
form{
width:100%;
height: 520px;
background:#DEDEDE;
text-align: center;
padding:30px 0;
margin:0 auto;
position: relative;
}
form p{
display: inline-block;
position: absolute;
right: 500px;
}
form div{
margin-top: 10px;
}
form input{
height: 25px;
}
form #sex{
margin-left:-132px;
}
form #submit{
width: 90px;
height: 50px;
font-size:20px;
border-radius: 10px;
background-color: #436EEE;
color: white;
margin-top: 20px;
}
</style>
</head>
<body>
<div class="wrapper">
<header>
<p>用户注册</p>
</header>
<form id="form">
<div>
<p>用户名：</p><input type="text" name="name" id="username" ><span class="present"></span>
</div>
<div>
<p>登录密码：</p><input type="text" name="name" id="pass" ><span class="present"></span>
</div>
<div>
<p>确认密码：</p><input type="text" name="name" id="username" ><span class="present"></span>
</div>
<div>
<p>姓名：</p><input type="text" name="name" id="username" ><span class="present"></span>
</div>
<div>
<p>性别：</p><select id="sex"><option value="男" selected>男</option><option value="女">女</option></select><span></span>
</div>
<div>
<p>身份证号码：</p><input type="text" name="name" id="username" ><span class="present"></span>
</div>
<div>
<p>邮箱：</p><input type="text" name="name" id="username" ><span class="present"></span>
</div>
<div>
<p>电话：</p><input type="text" name="name" id="username" ><span class="present"></span>
</div>
<input type="submit" value="提交" id="submit">
</form>
</div>
<script type="text/javascript">
var spans=document.getElementsByTagName("span");
var forms=document.getElementById("form");
var inputs=forms.getElementsByTagName("input");
var submit=document.getElementById("submit");
var confirm=[false,false,false,false,false,false,false]
<!-- 各个需要验证的正则实例函数 -->
var reg=[/^[a-z]\w{5,17}$/i,//账号验证
/^\S[6,18]$/,//密码验证
/^\S[6,18]$/,//确认密码
/^[\u4e00-\u9fa5]{2,4}$/,//中文名验证
null,
/^\d{17}[0-9x]$|^\d(15)$/,//身份证号码验证
/^\w+@\w+\.[a-zA-Z_]{2,4}$/i,//邮箱验证
/^\d{11}$///电话号码验证
];
var str=["6-20位字母、数字或“_”,字母开头",
"6-18位，包括数字字母或符号，中间不能有空格",
"请输入密码",
"真实姓名，两位到四位的中文汉字",
null,
"请输入18位的身份证号码",
"请输入邮箱",
"请输入电话号码"
];
var str2={
'1':"格式不正确",
'2':"两次输入密码不一致",
};
<!-- input获得焦点之后的内容显示 -->
for( i=0;i<inputs.length;i++){
inputs[i].onfocus=function(){
spans[i].innerHTML=str[i];
}
<!-- input失去焦点之后的内容显示 -->
for (var i = 0; i < inputs.length; i++) {
inputs[i].onbiur=function(){
if (this.value=='') {spans[i].innerHTML="内容不能为空"}
else{
if (reg[i].exec()) {
spans[i].innerHTML='ok';
confirm[i]=true;
}else{spans[i].innerHTML=this.value+str2[1]}
}
}
}
</script>
</body>
</html>
1回答
-
同学你好，代码中的问题：
1、缺少闭合的括号：
不过这段代码不需要，下面写了新的，全部注释就可以。
2、js中注释和html中不同，要用//单行注释或者/**/多行注释哦。
3、i值作用域的问题，在上一个相似问题中已经回复过了，可以进行查看：
http://class.imooc.com/course/qadetail/135338
这里修改为：
自己重新测试下，祝学习愉快！
0
相似问题