<body>
<select id="province"></select>
<select id="city"></select>
<script type="text/javascript">
(function(){
var provinceAry = ["四川","广东","湖南"];
var cityAry = [
["成都","绵阳","德阳"],
["广州","深圳","东莞"],
["长沙","衡阳","湘潭"]
];
var fillSelect = function(ary,st){
st.options.length = 0;
ary.forEach(function(value,i){
var opt = document.createElement("option");
opt.appendChild(document.createTextNode(value));
opt.value = i;
st.appendChild(opt);
});
}
var provinceSelect = document.getElementById("province");
fillSelect(provinceAry,provinceSelect);
//填充城市
var citySelect = document.getElementById("city");
fillSelect(cityAry[provinceSelect.value],citySelect);
provinceSelect.onchange = function(){
fillSelect(cityAry[this.value],citySelect);
}
})();
</script>
</body>
