当前位置: 代码迷 >> Java Web开发 >> javascript中的options.length=0有关问题
  详细解决方案

javascript中的options.length=0有关问题

热度:4298   发布时间:2013-02-25 21:13:34.0
javascript中的options.length=0问题
先上代码

<!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;
  相关解决方案