主要原理是把所有要关联的数据都存在一个二维数组或者两个一维数组中,在其中一个select发生改变后通过数组取出对应的值,在第二个select中显示出来。以下是一个例子,你可以参考一下。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb_2312-80">
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
<title>销售数量分布汇总表</title>
<script language="javascript">
<!--
var array_a=new Array("1","2","3");
var array_b=new Array("4","5","6");
var array_c=new Array("7","8","9");
//定义对应的数组,如果是动态生成的数据,可以从数据库取到本地数组中function change_show()
{
  var tmp=window.document.QueryForm.sel1.value;//select1中的值
  if (tmp=="a")    the_array=eval(array_a);
  if (tmp=="b")    the_array=eval(array_b);
  if (tmp=="c")    the_array=eval(array_c);
  //判断要显示哪一个数组的数据  var arr_len=window.document.QueryForm.sel2.options.length
  for (loop=0;loop<arr_len;loop++)
  {
    window.document.QueryForm.sel2.remove(0);
        //先清空第二个select中的所有数据
  }
  
  for (loop=0;loop<the_array.length;loop++)
  {
        var e=window.document.createElement ("OPTION");//创建新对象
          e.text=the_array[loop];
        e.value=the_array[loop];//赋值
        window.document.QueryForm.sel2.add(e);  //添加到select2中
  }
          window.document.QueryForm.sel2.refresh;//刷新第二个select
}
-->
</script>
<body>
<form name=QueryForm>
<select name=sel1 size=1 onclick="javascript:change_show()">
<option selected value=a>a</option>
<option value=b>b</option>
<option value=c>c</option>
</select><select name=sel2 size=1></select>
</form>
</body>
</html>