首页 > 编程 > JavaScript > 正文

JavaScript省市级联下拉菜单实例

2019-11-19 17:36:03
字体:
来源:转载
供稿:网友

最近学了一个关于省市级联简单的小例子,贴出来与大家分享一下:

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>index</title></head><body> <select id="selProvince" onchange="changeCity()">  <option>请选择省份</option> </select> <select id="selCity">  <option>请选择城市</option> </select> <script>  function $(ID){  return document.getElementById(ID);  }  var cityList=new Array();  cityList['北京市']=['东城区','西城区','昌平区'];  cityList['河北省']=['保定','石家庄','定州'];   cityList['江苏省'] = ['南京市','苏州市','无锡市'];   cityList['浙江省'] = ['杭州市','宁波市','温州市'];   cityList['四川省'] = ['四川省','成都市'];   cityList['海南省'] = ['海口市'];  function changeCity(){   var province=$("selProvince").value;   var city=$("selCity");    city.options.length=0;   for (var i in cityList) {   if(i==province){    for (var j in cityList[i]) {     city.add(new Option(cityList[i][j],cityList[i][j]),null);    }   }   }  }  function allCity(){   var province=$("selProvince");   for (var i in cityList) {    province.add(new Option(i,i),null);   }  }  window.onload=allCity; </script></body></html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持武林网。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表