HTML-js-下拉级联

HTML-js-下拉级联

在学习下拉列表中需要联系下一级，产生联级关系，这里用省份来做一个例子：

<select id="sf">
</select>
<select id="sf">
</select id="cs">
<script>

var array=[];
var[0]=["四川","成都"，"遂宁"，"乐山"];
var[1]=["云南","昆明"，"丽江"，"大理"];
var[2]=["重庆","江北"，"渝北"，"北碚"];
window.onload=function(){
//这里获取seclec Id；
var sf=docunment.getElementById("sf");
	for(var i=0;i<array.length;i++){
		//建立一个变量接受第一个下拉列表的内容；
		var op=new option(array[i][0],array[i][0]);
		sf.appendChild(op);
	}
	//这里需要为默认值(第一个值)设置一个连接
	for(var i=0;i<array[0].length;i++){
		var cs = document.getElementById("cs");
            var op = new Option(array[0][i], array[0][i]);
            cs.appendChild(op);
	}
}
//在select这里设置一个监听；
sf.addEventLister("change",function(event){
	var cs1=event.target.value;
	for(var i=0;i<array.length;i++){
		if(cs==array[i][0]){
		cs.length=0;
			for(var j=1;j<array[i].length;j++){
			var op=new option(array[0][j],array[0][j]);
			cs.appendChild(op);
			}			
		}
	}
});
</script>

这是我目前能力所做出来的，相信肯定会有更好的方法，希望大神们能多加指导，谢谢！