html实现二级联动
直接上代码!
body的代码
<script>
var one=document.getElementById("one");
var two=document.getElementById("two");
var t1=['北京','上海','天津'];
/*定义成二维数组*/
var t2=[['东城区','海淀','朝阳'],['黄浦江','1'],['东丽','滨海区']];
/*先输出第一个复选框*/
one.innerHTML="";
for(var i=0;i<t1.length;i++){
one.innerHTML+="<option>"+t1[i]+"</option>";
}
/*默认输出第一个对应的内容*/
for(var i=0;i<t2[0].length;i++){
two.innerHTML+="<option>"+t2[0][i]+"</option>";
}
/*定义onchange事件 根据index输出对应的内容*/
one.onchange=function(){
var index=this.selectedIndex;
two.innerHTML="";
for(var i=0;i<t2[index].length;i++){
two.innerHTML+="<option>"+t2[index][i]+"</option>";
}
}
</script>
有什么疑问评论留言!