先上代码
<!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=gb2312" />
<title>级联特效</title>
</head>
<script type="text/javascript">
function change(){
var classes=document.getElementById("classes");
var t_class=classes.value;
var people=document.getElementById("people");
//此处如果连写4个people.options.length=0;代码就正常了
//people.options.length=0;
//people.options.length=0;
//people.options.length=0;
people.options.length=0;
alert("options.length值为:"+people.options.length);
switch(t_class){
case "三班":
people.add(new Option("小王","小王"),null);
people.add(new Option("小李","小李"),null);
people.add(new Option("小红","小红"),null);
people.add(new Option("小军","小军"),null);
people.add(new Option("小王","小王"),null);
people.add(new Option("小李","小李"),null);
people.add(new Option("小红","小红"),null);
people.add(new Option("小军","小军"),null);
break;
case "六班":
people.add(new Option("老王","老王"),null);
people.add(new Option("老李","老李"),null);
people.add(new Option("老红","老红"),null);
people.add(new Option("老军","老军"),null);
people.add(new Option("老王","老王"),null);
people.add(new Option("老李","老李"),null);
people.add(new Option("老红","老红"),null);
people.add(new Option("老军","老军"),null);
break;
}
}
</script>
<body>
<form>
<select id="classes" onchange="change()">
<option>--选择班级--</option>
<option value="三班">三班</option>
<option value="六班">六班</option>
</select>
<select id="people">
<option>--选择人物--</option>
</select>
</form>
</body>
</html>
问题在于people.options.length=0;这句话
按道理people.options.length=0;是直接清除了下拉选项,
但是alert后发现,people.options.length=0;只是把下来选项除以2了
也就是说先选择3班,然偶从3班选到6班的时候,会发现people.options.length=0;这句话只是把3班一半的人去掉了,仍然有另一半在六班
而再写一个people.options.length=0;就会剩下1/4,写三个people.options.length=0;,就剩下1/8,写4个people.options.length=0;代码就正常了
想知道options.length=0;这句代码为什么会出现除以2的情况
------解决方案--------------------------------------------------------
你这样写晕不晕，还看不清楚。我这里运行是正常的啊。
你这么写：
<!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=gb2312" />
<title>级联特效</title>
</head>
<script type="text/javascript">
function change(){
var classes=document.getElementById("classes");
var t_class=classes.value;
var people=document.getElementById("people");
//此处如果连写4个people.options.length=0;代码就正常了
//people.options.length=0;
//people.options.length=0;
//people.options.length=0;