麻烦下大家,我觉得要疯了,,看了一下午都没看出为什么无法正确输出结果。。。
我怎么都没有看出来,为什么不能正确地输出性别的情况呢!!!麻烦大家看看!!
function hs()
{
//全局判断
var judge=true;
//输出的文字
var str="";
//姓名的判断
var name=document.getElementById("name").value;
if(name.length==0)
{
document.getElementById("namenull").innerHTML="姓名不能为空";
judge=false;
}
else
{
document.getElementById("namenull").innerHTML="";
str+="姓名:"+name;
}
//密码判断
var password=document.getElementById("password").value;
if(password.length==0)
{
document.getElementById("passwordnull").innerHTML="密码不能为空";
judge=false;
}
else
{
document.getElementById("passwordnull").innerHTML="";
str+="\n密码:"+name;
}
//性别判断
var sex=document.myform1.sex;
var s="";
var check=false;
for(var i=0;i<=sex.length;i++)
{
if(document.myform1.sex[i].checked)
{
s+=document.myform1.sex[i].value;
check=true;
}
}
if(!check)
{
document.getElementById("sexnull").innerHTML="性别要选择";
judge=false;
}
else
{
document.getElementById("sexnull").innerHTML="";
str+="\n性别:"+s;
}
/*if(s.length==0)
{
document.getElementById("sexnull").innerHTML="性别要选择";
judge=false;
}
else
{
document.getElementsById("sexnull").innerHTML="";
str+="\n性别:"+s;
}*/
if(judge)
{alert (str);}
}
</script>
<form name="myform" id="myform1" >
<fieldset>
<legend>调查表</legend>
<div align="center">调查表</div>
姓名 <input type="text" id="name" /> <label id="namenull" ></label><br /><br />
密码 <input type="password" id="password" /> <label id="passwordnull"></label><br /><br />
性别 <input type="radio" name="sex" value="男"/>男
<input type="radio" name="sex" value="女"/>女 <label id="sexnull"></label><br /><br />
爱好 <input type="checkbox" name="like" value="电影" />电影
<input type="checkbox" name="like" value="运动" />运动
<input type="checkbox" name="like" value="音乐" />音乐
<input type="checkbox" name="like" value="其他" />其他 <label id="likenull" class="lb"></label><br /><br />
职业 <select id="job"><option></option>
<option>教师</option>
<option>学生</option>
</select> <label id="jobnull" class="lb"></label><br /><br />
手机 <input type="text" id="phone" /> <label id="phonenull" class="lb"></label><br /><br />
建议 <textarea rows="10" cols="100"> </textarea><br /><br />
<input type="button" value="提交" onclick="hs()">
</fieldset>
</form>
</body>
</html>
[解决办法]
<script type="text/javascript">
function hs()
{
//全局判断
var judge=true;
//输出的文字
var str="";
//姓名的判断
var name=document.getElementById("name").value;
if(name.length==0)
{
document.getElementById("namenull").innerHTML="姓名不能为空";
judge=false;
}
else
{
document.getElementById("namenull").innerHTML="";
str+="姓名:"+name;
}
//密码判断
var password=document.getElementById("password").value;
if(password.length==0)
{
document.getElementById("passwordnull").innerHTML="密码不能为空";
judge=false;
}
else
{
document.getElementById("passwordnull").innerHTML="";
str+="\n密码:"+name;
}
//性别判断
var sex=document.myform1.sex;
var s="";
var check=false;
for(var i=0;i<sex.length;i++)
{
if(sex[i].checked)
{
s+=sex[i].value;
check=true;
}
}
if(!check)
{
document.getElementById("sexnull").innerHTML="性别要选择";
judge=false;
}
else
{
document.getElementById("sexnull").innerHTML="";
str+="\n性别:"+s;
}
/*if(s.length==0)
{
document.getElementById("sexnull").innerHTML="性别要选择";
judge=false;
}
else
{
document.getElementsById("sexnull").innerHTML="";
str+="\n性别:"+s;
}*/
if(judge)
{alert (str);}
}
</script>
<form name="myform1" id="myform1" >
<fieldset>
<legend>调查表</legend>
<div align="center">调查表</div>
姓名 <input type="text" id="name" /> <label id="namenull" ></label><br /><br />
密码 <input type="password" id="password" /> <label id="passwordnull"></label><br /><br />
性别 <input type="radio" name="sex" value="男"/>男
<input type="radio" name="sex" value="女"/>女 <label id="sexnull"></label><br /><br />
爱好 <input type="checkbox" name="like" value="电影" />电影
<input type="checkbox" name="like" value="运动" />运动
<input type="checkbox" name="like" value="音乐" />音乐
<input type="checkbox" name="like" value="其他" />其他 <label id="likenull" class="lb"></label><br /><br />
职业 <select id="job"><option></option>
<option>教师</option>
<option>学生</option>
</select> <label id="jobnull" class="lb"></label><br /><br />
手机 <input type="text" id="phone" /> <label id="phonenull" class="lb"></label><br /><br />
建议 <textarea rows="10" cols="100"> </textarea> <br /><br />
<input type="button" value="提交" onclick="hs()">
</fieldset>
</form>
</body>
</html>
[解决办法]
几点建议:
1. 用firefox浏览器, 配合firebug来调试js
2. 学jquery, 配合jquery validate验证插件来做验证, 而不是这样手写。
3. 即使没有前面两项, 也同样可以调试好你这个程序, 只是你没有找到办法而已。
踩地雷, 每一步都alert一下
4. document.form.xxx 这种方式不要再用了。
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.2.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.js" type="text/javascript"></script>
<style type="text/css">
label{ color:Red;}
</style>
<script type="text/javascript">
function hs() {
//全局判断
var judge = true;
//输出的文字
var str = "";
//姓名的判断
var name = document.getElementById("name").value;
if (name.length == 0) {
document.getElementById("namenull").innerHTML = "姓名不能为空";
judge = false;
}
else {
document.getElementById("namenull").innerHTML = "";
str += "姓名:" + name;
}
//密码判断
var password = document.getElementById("password").value;
if (password.length == 0) {
document.getElementById("passwordnull").innerHTML = "密码不能为空";
judge = false;
}
else {
document.getElementById("passwordnull").innerHTML = "";
str += "\n密码:" + name;
}
//性别判断
var sex = document.getElementsByName("sex");//1.
var s = "";
var check = false;
for (var i = 0; i < sex.length; i++) {//2. '<=' 改为 '<'
if (sex[i].checked) {//3.
s += sex[i].value; //4.
check = true;
}
}
if (!check) {
document.getElementById("sexnull").innerHTML = "性别要选择";
judge = false;
}
else {
document.getElementById("sexnull").innerHTML = "";
str += "\n性别:" + s;
}
}
</script>
</head>
<body>
<form name="myform" id="myform1">
<fieldset>
<legend>调查表</legend>
<div align="center">
调查表</div>
姓名 <input type="text" id="name" />
<label id="namenull">
</label>
<br />
<br />
密码 <input type="password" id="password" />
<label id="passwordnull">
</label>
<br />
<br />
性别 <input type="radio" name="sex" value="男" />男
<input type="radio" name="sex" value="女" />女
<label id="sexnull">
</label>
<br />
<br />
爱好
<input type="checkbox" name="like" value="电影" />电影
<input type="checkbox" name="like" value="运动" />运动
<input type="checkbox" name="like" value="音乐" />音乐
<input type="checkbox" name="like" value="其他" />其他
<label id="likenull" class="lb">
</label>
<br />
<br />
职业
<select id="job">
<option></option>
<option>教师</option>
<option>学生</option>
</select>
<label id="jobnull" class="lb">
</label>
<br />
<br />
手机 <input type="text" id="phone" />
<label id="phonenull" class="lb">
</label>
<br />
<br />
建议 <textarea rows="10" cols="100"> </textarea>
<br />
<br />
<input type="button" value="提交" onclick="hs()">
</fieldset>
</form>
</body>
</html>