js简单设置两个下拉框联动(IE8不支持此方法)

两个select下拉框必须设置id，且id不能相同

<select id="type1" name="type1" onChange="change();">
    <option value="">请选择</option>
    <option value="1">山东</option>
    <option value="2">河南</option> 
</select> 
<select name="type2" id="type2">
    <option value="">请选择</option>
</select>

js方法

function change(){
　 //获取第一个下拉框的id
　 var select = document.getElementById("type1");
　 //获取选择下拉框的值
 　var value = select.value;
   //获取第二个下拉框的id
   var area = document.getElementById("type2");
   //判断第一个下拉框的值
   switch (value) {
   case "1":
   　　area.innerHTML = "<option value="0">请选择</option>"
                    + "<option value="1_1">济南</option>"
                    + "<option value="1_2">青岛</option>"
                    + "<option value="1_3">潍坊</option>";
      break;
   case "2":
      area.innerHTML = "<option value="0">请选择</option>"
                     + "<option value="2_1">石家庄</option>"
                     + "<option value="2_2">郑州</option>"
                     + "<option value="2_3">廊坊</option>";
      break;
   case "0":
      area.innerHTML = "<option value="">请选择</option>";
      break;
   default:
         alert("error");
       }
 }

效果: