1. 程式人生 > >三級聯動---(省市區)

三級聯動---(省市區)

首先建立三個下拉列表框

<select id="sheng"></select>
        <select id="shi"></select>
        <select id="qu"></select>

分別獲取他們的物件

<script>
            var sheng=document.getElementById("sheng");
            var shi=document.getElementById("shi");
            var
qu=document.getElementById("qu");

var sheng_str="";
            for(i=0;i<data.length;i++){
            sheng_str+="<option>"+data[i].name+"</option>"
            }
            sheng.innerHTML=sheng_str;

  var shi_index;
            sheng.onchange=function(){
                qu.innerHTML
=""; shi_index=sheng.selectedIndex; var shi_str=""; var shi_data=data[shi_index].children for(i=0;i<shi_data.length;i++){ shi_str+="<option>"+shi_data[i].name+"</option>" } shi.innerHTML
=shi_str; }

shi.onchange=function(){
                var qu_index=shi.selectedIndex;
                var qu_str="";
                var qu_data=data[shi_index].children[qu_index].children;
                for(i=0;i<qu_data.length;i++){
                    qu_str+="<option>"+qu_data[i].name+"</option>"
                }
                qu.innerHTML=qu_str;
            }
</script>