js關聯三級

自己研究三級加看網上的例子得出來的

<select id="province">

   <option value="">----請選擇----</option>

  </select>省份

  <select id="city">

   <option value="">----請選擇----</option>

   </select>市

  <select id="country">

   <option value="">----請選擇----</option>

   </select>區

var city =[

     ['合肥','宿州','淮北','阜陽','蚌埠','淮南','滁州','馬鞍山','蕪湖','銅陵','安慶','黃山','六安','池州','宣城','亳州'],

     ['廣州','深圳','清遠','韶關','河源','梅州','潮州','汕頭','揭陽','汕尾','惠州','東莞','珠海','中山','江門','佛山','肇慶','雲浮','陽江','茂名','湛江']];

  var country =[[['合肥1','合肥2'],['宿州1','宿州2'],['淮北1','淮北2'],['阜陽1','阜陽2'],['蚌埠1','蚌埠2'],['淮南1','淮南2']

      ,['滁州1','滁州2'],['馬鞍山1','馬鞍山2'],['蕪湖1','蕪湖2'],['銅陵1','銅陵2'],['安慶','安慶2'],['黃山','黃山2']

      ,['六安1','六安2'],['池州1','池州2'],['宣城1','宣城2'],['亳州1','亳州2']],[['廣州1','廣州2'],['深圳1','深圳2']

      ,['清遠','清遠2'],['韶關1','韶關2'],['河源1','河源2'],['梅州1','梅州2'],['潮州1','潮州2'],['汕頭1','汕頭2']

      ,['揭陽1','揭陽2'],['汕尾1','汕尾'],['惠州1','惠州2'],['東莞1','東莞2'],['珠海1','珠海2'],['中山1','中山2']

      ,['江門1','江門2'],['佛山1','佛山2'],['肇慶1','肇慶2'],['雲浮1','雲浮2'],['陽江1','陽江2'],['茂名1','茂名2']

      ,['湛江1','湛江2']]];

$(function(){

   for(var i in province){

    $("#province").append('<option>'+province[i]+'</option>');

}

 $("#province").change(function(){

      $("#city").children().not(':eq(0)').remove();//選擇其他省的時候，把之前内容清空掉

      $("#country").children().not(':eq(0)').remove();//這個步驟是為了，當你選擇其他省市區選好後，你選别的其他省區是不會清空，

     var City=$(this).children("option:selected").index();//取到selected的值

     var citys = city[num1-1]; 

      var citys = city[City-1]; //為什麼要City-1呢 因為市裡面的要與省的相對于,我們打的第一行有個---請選擇----,要把它減掉才能對應起來.然後傳到city裡面,再交到citys周遊出來

      for(var i in citys){

       $("#city").append("<option>"+citys[i]+"</option>");

      }

    });