二级联动遇到问题，请高手看看

下面的二级联动在一级分类切换时，二级分类的第一个数组如果大于第二个时，下拉菜单的最下方就会显示上一个一级栏目下的子栏目。比如说：我选择“脚本语言”子栏目是3个，在选择“高级语言”时，子栏目显示的就不是2个，而是3个，“C/C++,Java、JSP” 上一个的子栏目最后一项不能清除，请教给力的高手。<html>
<head>
<title>This is a test!</title>
</head>
<body>
<form name="frm">
<select name="s1" onChange="redirec(document.frm.s1.options.selectedIndex)">
<option selected>请选择</option>
<option value="1">脚本语言</option>
<option value="2">高级语言</option>
<option value="3">其他语言</option>
</select> <select name="s2">
<option value="请选择" selected>请选择</option>
</select>
<input type=text id=s3 readonly>
</form>
<script language="javascript">
//获取一级菜单长度
var select1_len = document.frm.s1.options.length;
var select2 = new Array(select1_len);
//把一级菜单都设为数组
for (i=0; i<select1_len; i++)
{ select2[i] = new Array();}
//定义基本选项
select2[0][0] = new Option("请选择", " "); select2[1][0] = new Option("PHP", " 666");
select2[1][1] = new Option("ASP", " 111");
select2[1][2] = new Option("JSP", "222 "); select2[2][0] = new Option("C/C++", " ");
select2[2][1] = new Option("Java", " ");
select2[3][0] = new Option("Perl", " ");
select2[3][1] = new Option("Ruby", " ");
//联动函数
function redirec(x)
{
var temp = document.frm.s2;
for (i=0;i<select2[x].length;i++)
{ temp.options[i]=new Option(select2[x][i].text,select2[x][i].value);}
temp.options[0].selected=true;
}
</script>
</body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

给个正确的你，自己研究研究·····
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>注册</TITLE>
<SCRIPT language="JavaScript" >
   function changeTerm( )
  {
var courseList = new Array( );
     courseList['第一学期'] = ['Java', 'SqlServer基础', 'C#', 'HTML'];
courseList['第二学期'] =['JavaScript', 'SqlServer高级', '.NET', 'JSP'];
     courseList['第二学年'] = ['Struts', 'ASP.NET', 'Ajax','Spring','Hibernate'];

//获得学期选项的索引号，如第一学期为1，比对应数组索引号多1
var pIndex=document.myform.selTerm.value;
var newOption1;
document.myform.selCourse.options.length=0;
for (var j in courseList[pIndex])
{
         newOption1=new Option(courseList[pIndex][j], courseList[pIndex][j]);
document.myform.selCourse.options.add(newOption1);
     }
  }


</SCRIPT>
</HEAD>

<BODY>

<FORM name="myform" id="myform" action="register_success.htm" onSubmit="return checkForm( )"  >

  <TABLE border="0"  align="center" >
    <TR>
      <TD colspan="2" align="center">考试申请</TD>
    </TR>
    <TR>
      <TD>学期</TD>
      <TD><SELECT name="selTerm"   onChange="changeTerm( )">
        <OPTION>--请选择学期--</OPTION>
        <OPTION value="第一学期">第一学期</OPTION>
        <OPTION value="第二学期">第二学期</OPTION>
        <OPTION value="第二学年">第二学年</OPTION>
      </SELECT></TD>
    </TR>
    <TR>
      <TD>课程</TD>
      <TD><SELECT name="selCourse"   >
        <OPTION>--请选择对应学期的课程--</OPTION>
      </SELECT></TD>
    </TR>
  </TABLE>
</FORM>

</BODY>
</HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>注册</TITLE>
<SCRIPT language="JavaScript" >
  function changeTerm( )
  {
var courseList = new Array( );
  courseList['第一学期'] = ['Java', 'SqlServer基础', 'C#', 'HTML'];
courseList['第二学期'] =['JavaScript', 'SqlServer高级', '.NET', 'JSP'];
  courseList['第二学年'] = ['Struts', 'ASP.NET', 'Ajax','Spring','Hibernate'];

//获得学期选项的索引号，如第一学期为1，比对应数组索引号多1
var pIndex=document.myform.selTerm.value;
var newOption1;
document.myform.selCourse.options.length=0;
for (var j in courseList[pIndex])
{
  newOption1=new Option(courseList[pIndex][j], courseList[pIndex][j]);
document.myform.selCourse.options.add(newOption1);
  }
  }


</SCRIPT>
</HEAD>

<BODY>

<FORM name="myform" id="myform" action="register_success.htm" onSubmit="return checkForm( )" >

  <TABLE border="0" align="center" >
  <TR>
  <TD colspan="2" align="center">考试申请</TD>
  </TR>
  <TR>
  <TD>学期</TD>
  <TD><SELECT name="selTerm" onChange="changeTerm( )">
  <OPTION>--请选择学期--</OPTION>
  <OPTION value="第一学期">第一学期</OPTION>
  <OPTION value="第二学期">第二学期</OPTION>
  <OPTION value="第二学年">第二学年</OPTION>
  </SELECT></TD>
  </TR>
  <TR>
  <TD>课程</TD>
  <TD><SELECT name="selCourse" >
  <OPTION>--请选择对应学期的课程--</OPTION>
  </SELECT></TD>
  </TR>
  </TABLE>
</FORM>

</BODY>
</HTML>
自己再连接一下数据库
希望对你有帮助
你的代码的问题在于没有初始化s2。每次改变s1的时候都必须清空s2。仔细看看我在你基础上改的联动函数跟你的有什么区别
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>This is a test!</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<form name="frm"><select name="s1"
onChange="redirec(document.frm.s1.options.selectedIndex)">
<option selected>请选择</option>
<option value="1">脚本语言</option>
<option value="2">高级语言</option>
<option value="3">其他语言</option>
</select> <select name="s2">
<option value="请选择" selected>请选择</option>
</select> <input type=text id=s3 readonly></form>
<script language="javascript">
//获取一级菜单长度
var select1_len = document.frm.s1.options.length;
var select2 = new Array(select1_len);
//把一级菜单都设为数组
for (i = 0; i < select1_len; i++) {
select2[i] = new Array();
}
//定义基本选项
select2[0][0] = new Option("请选择", " "); select2[1][0] = new Option("PHP", " 666");
select2[1][1] = new Option("ASP", " 111");
select2[1][2] = new Option("JSP", "222 "); select2[2][0] = new Option("C/C++", " ");
select2[2][1] = new Option("Java", " ");
select2[3][0] = new Option("Perl", " ");
select2[3][1] = new Option("Ruby", " ");
//联动函数
function redirec(x) {
var temp = document.frm.s2;
while (temp.options.length > 0) {
temp.options.remove(temp.options[0]);
}

for (i = 0; i < select2[x].length; i++) {
temp.options[i] = new Option(select2[x][i].text, select2[x][i].value);
}
temp.options[0].selected = true;
}
</script>
</body>
</html>另外，就算是改对了。你的代码还有如下问题：
1.命名太恶心了。
2.缩进没有
3.把script放在页面尾部执行不是一个好的习惯。请放入onload中
4.循环变量没有用var，那样出了function，循环变量不会被释放
5.没有加入任何编码用标签，起码要在head中加入meta标签啊。否则会出现乱码。
好了，随便看看，一堆问题。