摘要：总结：写那个js函数的时候，siaplay拼错了，我在控制台调试，好长时间才弄好。也是醉了。HTML：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="shortcut icon" type=&q
总结：
写那个js函数的时候，siaplay拼错了，我在控制台调试，好长时间才弄好。也是醉了。
HTML：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="shortcut icon" type="image/x-icon" href="static/images/footlogo.png" >
<link rel="stylesheet" type="text/css" href="static/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="static/css/login.css">
<link rel="stylesheet" type="text/css" href="static/font-awesome/css/font-awesome.min.css">
<script type="text/javascript" src="static/layui/layui.js"></script>
<title>小米商城-登录</title>
</head>
<body>
<!-- 顶部 -->
<div class="header">
<a href="./index.html"><img src="static/images/5.png" alt=""></a>
</div>
<!-- 内容 -->
<div class="content">
<div class="login-content">
<div class="content-form">
<div class="content-form-main">
<p id="reg-tags-0" onclick="changeReg(0, 'register-', 2)">账号登录</p>
<span>|</span>
<p id="reg-tags-1" onclick="changeReg(1, 'register-', 2)">扫码登录</p>
</div>
<div class="content-form-content" id="register-0">
<form action="">
<input type="text" placeholder="邮箱/手机号码/小米ID">
<input type="password" placeholder="密码">
<button>登录</button>
</form>
<h6><a href="" style="color:#ff6500;">手机短信登录/注册</a><span><a class="a-hover" href="">立即注册</a> | <a class="a-hover" href="">忘记密码？</a></span></h6>
<div class="login-form-pic">
<p>其它方式登录</p>
<ul>
<li class="pic1" style="margin-right:35px; background:#0288d1; "><i class="fa fa-qq"></i></li>
<li class="pic1" style="margin-right:35px; background:#DA2F31;"><i class="fa fa-weibo"></i></li>
<li class="pic1" style="margin-right:35px; background:#00A9EA;"><i class="fa fa-twitter-square"></i></li>
<li class="pic4" style="background:#00D33C;"><i class="fa fa-weixin"></i></li>
</ul>
</div>
</div>
<div class="content-form-content0" style="display:none;" id="register-1">
<img src="static/images/下载.png" alt="">
<p>使用<span style="color:#ff6700;"> 小米商城APP </span>扫一扫</p>
<p>小米手机可打开「设置」>「小米帐号」扫码登录</p>
</div>
</div>
</div>
</div>
<!-- 底部 -->
<div class="footer">
<p style="margin-top: 60px;">简体<span>|</span>繁体<span>|</span>English<span>|</span> 常见问题<span>|</span> 隐私政策</p>
<p>小米公司版权所有-京ICP备10046444-<img src="static/images/ghs.png"> 京公网安备11010802020134号-京ICP证110507号</p>
</div>
<script type="text/javascript">
function changeReg(divId, divName, Count){
for(var i=0; i<Count; i++){
document.getElementById(divName+i).style.display='none';
}
document.getElementById(divName+divId).style.display='block';
// console.log( document.getElementById('register-1').style.display)
if(divId==0){
document.getElementById('reg-tags-0').style.color='#ff6700';
document.getElementById('reg-tags-1').style.color="#757575";
}
if(divId==1){
document.getElementById('reg-tags-1').style.color='#ff6700';
document.getElementById('reg-tags-0').style.color="#757575";
}
}
</script>
</body>
</html>
<!-- https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/553c5e503fc83138c76bd7c17c1434db.jpeg -->
CSS：
*{margin: 0px; padding: 0px;}
li{list-style:none;}
a{text-decoration: none;color: #ccc;cursor: pointer;}
.clear{clear: both;}
.header{
width:1226px;
height:100px;
line-height: 90px;
margin:0px auto;
padding-left:40px;
}
.content{
width:100%;
height:588px;
background: url(../images/login.png);
background-repeat: no-repeat;
/* text-align:center; */
}
.login-content{
width:1226px;
height:520px;
margin:0px auto;
}
.content-form{
width: 410px;
height:520px;
float:right;
background: #fff;
margin:38px 50px;
}
.content-form-main{
width:330px;
font-size:23px;
color:#757575;
margin:30px auto;
text-align: center;
}
#reg-tags-0{
color:#ff6700;
}
input{
display:block;
border:none;
width:328px;
padding:11px;
height:28px;
border:1px solid #e0e0e0;
margin:25px auto;
}
button{
width:350px;
height:50px;
display: block;
background:#ff6700;
color:#fff;
border:none;
margin:0px auto;
}
.content-form-content {
/* display:none; */
}
.content-form-content h6{
width:350px;
height:40px;
line-height:40px;
font-weight:400;
margin:0px auto;
font-size:13px;
}
.content-form-content span{
float:right;
}
.a-hover:hover{
color:#ff6700;
}
.content-form-main span{
margin:0px 40px;
color:#ccc;
}
.content-form-main p{
display: inline-block;
}
.login-form-pic{
width:350px;
margin:100px auto 0px;
border-top:1px solid #e0e0e0;
position: relative;
}
/* 其它方式登录 */
.login-form-pic p{
width:100px;
height:30px;
line-height:30px;
background: #fff;
color:#ccc;
position: absolute;
top:-15px;
left:125px;
text-align: center;
line-height: 30px;
}
.login-form-pic ul{
width:233px;
margin:20px auto 0px;
}
.login-form-pic ul li{
float:left;
width:32px;
height:32px;
background:#aaa;
color:#fff;
text-align: center;
line-height: 32px;
border-radius: 16px;
}
.login-form-pic ul li i{
font-size:17px;
}
.content-form-content0{
width:350px;
margin:0px auto;
text-align:center;
}
.content-form-content0 img{
height:190px;
width:180px;
margin:70px auto 15px;
}
.content-form-content0 p{
width:350px;
margin:0px auto;
height:20px;
line-height:20px;
color:#757575;
font-size: 13px;
}
.footer{
width:1226px;
height:38px;
margin:0px auto;
text-align: center;
line-height: 38px;
color:#757575;
}
.footer p span{
margin:0px 10px;
}
批改老师：韦小宝批改时间：2019-03-04 09:06:41
老师总结：这个错误不应该啊 js报错不是有指定多少多少行嘛 要仔细去看报错的内容
