你好,这是我的做的一个网页登录页面,但是在验证码未输入的情况下也可以登录到下一个页面,请问这代码是错在哪里,可以帮我看看我的代码吗?
<!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/11.css" rel="stylesheet" type="text/css" />-->
<style>
*{margin:0 auto;padding:0;font-family: "Microsoft JhengHei";}
a:link,a:visited{text-decoration:none; color:#666;}
/*header*/
.head{width:980px;margin-top:50px;height:40px;}
.head span{float:left;font-size:20px;}
.head p{float:right;font-size:20px;}
.head a:hover{color:#a5232e;}
.line{background-image:url(../images/reg_hr.png); height:20px; width:1220px;}
/*content*/
.content{width:980px; height:400px; margin:50px auto; color:#666;}
.content form{margin:0 auto; height:500px; width:600px;}
#phone{height: 35px;width: 330px;font-size: 15px;margin-left: 50px;border-radius: 5px;border: 1;padding-left: 8px; margin-top:30px;}
#msgyzm,#regyzm {height: 35px;width: 210px;font-size: 15px;margin-left: 15px;border-radius: 5px;border: 1;padding-left: 8px; margin-top:30px;}
#recode{color: #fff;background-color: #a5232e;font-size: 12pt;padding: 10px 12px ;margin-left: 10px;cursor: pointer; border-radius:5px;}
#code {color: #fff;background-color: #a5232e;font-size: 16pt;padding: 5px 25px ;margin-left: 10px;cursor: pointer; border-radius:5px;}
#search_pass_link {width: 70px;text-align: right;margin: 0 auto;padding: 5px;}
.btns {margin-left: 16%;height: 40px;border: 0;font-size: 16pt;background-color: #a5232e;color: #fff;cursor: pointer;
/*设置指针鼠标的样式*/border-radius: 5px;/*设置圆角样式*/border: 0; width:340px;}
</style>
</head>
<body>
<!--header-->
<div class="head">
<span><a href="register_1.html">返回</a></span>
<p><a href="author_login.html">登录</a></p>
</div>
<div class="line"></div>
<!--content-->
<div class="content">
<form action="login.html" onsubmit="return check()">
<p>手机号<input type="text" id="phone" name="telephone" maxlength="11" /></p>
<p>短信验证码<input type="text" id="msgyzm"/>
<span id="recode">发送验证码</span>
<div id="search_pass_link"></div>
<p>图片验证码<input type="text" id="regyzm"/>
<span id="code" title="看不清,换一张"></span>
<div id="search_pass_link"></div></p>
<input type="submit" id="submit" value="下一步" class="btns" onmouseover="this.style.backgroundColor='#d32'" onmouseout="this.style.backgroundColor='#a5232e'" >
</form>
</div>
</body>
</html>
<script type="text/javascript">
var code; //声明一个变量用于存储生成的验证码
document.getElementById("code").onclick = changeImg;
function changeImg() {
var arrays = new Array(
'1', '2', '3', '4', '5', '6', '7', '8', '9', '0',
'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j',
'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't',
'u', 'v', 'w', 'x', 'y', 'z',
'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J',
'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T',
'U', 'V', 'W', 'X', 'Y', 'Z'
);
code = ''; //重新初始化验证码
//alert(arrays.length);
//随机从数组中获取四个元素组成验证码
for(var i = 0; i < 4; i++) {
//随机获取一个数组的下标
var r = parseInt(Math.random() * arrays.length);
code += arrays[r];
}
document.getElementById('code').innerHTML = code; //将验证码写入指定区域
}
//效验验证码(表单被提交时触发)
function check() {
//获取用户输入的验证码
var input_code = document.getElementById('vcode').value;
if(input_code.toLowerCase() == code.toLowerCase()) {
//验证码正确(表单提交)
return true;
}
alert("请输入正确的验证码!");
//验证码不正确,表单不允许提交
return false;
}
</script>
非空判断下,你应该首先写一个判断条件当输入框内容为空时的处理