<select id="sheng"> <option value="">--請選擇--</option> <option value="0">北京市</option> <option value="1">河北省</option> <option value="2">山西省</option> <option value="3">內蒙古自治區</option></select><select id="shi"> <option value="">--請選擇--</option></select><select id="xian"> <option value="">--請選擇--</option></select>

var sheng = document.getElementById('sheng');var shi = document.getElementById('shi');var xian = document.getElementById('xian');

  var city = [   ['昌平區', '海淀區', '朝陽區', '東城區'],   ['石家莊市', '保定市', '張家口市', '唐山市'],   ['太原市', '大同市', '運城市', '臨汾市'],  ['呼和浩特市', '包頭市', '鄂爾多斯市', '赤峰市'] ];  var xians = [  [    ['北七家','回龍觀','霍營'],    ['中關村','蘇州街','西二旗'],    ['朝陽1','朝陽2','朝陽3'],    ['東城1','東城2','東城3'],  ],  [   ['新華區','橋東區','橋西區'],   ['高碑店','白溝','定興'],  ] ];

var index = null;

sheng.onchange = function() {   xian.innerHTML = '<option value="">--請選擇--</option>';// 初始化xian   index = this.value; // 獲取option的值   var result = city[index];//根據index去city數組中獲取對應的shi   // 將獲取的結果顯示在select#shi中，循環result數組中的"每一個值"，在值的兩側加上option標簽   var str = '<option value="">--請選擇--</option>';   for (var i = 0; i < result.length; i++) {   // 將所有的拼接好的市再次拼接為一個整體   str += '<option value="'+i+'">' + result[i] + '</option>';   }   shi.innerHTML = str;//將字符串寫入到select#shi中 }

shi.onchange = function(){ var value = this.value; // 獲取當前的value值   var county = xians[index][value]; // 根據市獲取市對應的縣 var str = '<option value="">--請選擇--</option>'; for (var i = 0; i < county.length; i++) {  str += '<option value="'+i+'">' + county[i] + '</option>'; } xian.innerHTML = str;//將數據寫入到select#xian中}