码迷,mamicode.com
首页 > 其他好文 > 详细

二级联动

时间:2016-05-27 23:34:29      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:

<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>

二级联动

标签:

原文地址:http://www.cnblogs.com/lk991827465/p/5536373.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!