javascript省份城市,js城市列表：代码示例

温馨提示：这篇文章已超过297天没有更新，请注意相关的内容是否还可用！

JavaScript省份城市列表是一种用于在网页中展示省份和城市信息的技术。通过使用JavaScript，我们可以动态地生成省份和城市的下拉菜单，使用户能够方便地选择他们所在的省份和城市。

我们需要创建一个包含省份和城市信息的JavaScript对象。对象的属性是省份名称，属性值是一个数组，包含该省份的城市列表。例如：


var provinceCity = {
  "北京市": ["北京市"],
  "上海市": ["上海市"],
  "广东省": ["广州市", "深圳市", "珠海市", "汕头市"],
  "浙江省": ["杭州市", "宁波市", "温州市", "绍兴市"],
  // 其他省份和城市...
};

接下来，我们可以通过JavaScript动态地生成省份和城市的下拉菜单。我们需要获取用于展示省份和城市的HTML元素，例如：


<select id="province"></select>
<select id="city"></select>

然后，我们可以使用JavaScript代码将省份信息添加到省份下拉菜单中。我们可以通过遍历`provinceCity`对象的属性来实现：


var provinceSelect = document.getElementById("province");
for (var province in provinceCity) {
  var option = document.createElement("option");
  option.text = province;
  provinceSelect.add(option);
}

接着，我们可以通过监听省份下拉菜单的变化事件，在选择省份后动态生成对应的城市列表。我们可以使用`onchange`事件和`selectedIndex`属性来实现：


var citySelect = document.getElementById("city");
provinceSelect.onchange = function() {
  var province = provinceSelect.options[provinceSelect.selectedIndex].text;
  var cities = provinceCity[province];
  citySelect.innerHTML = ""; // 清空城市下拉菜单
  for (var i = 0; i < cities.length; i++) {
    var option = document.createElement("option");
    option.text = cities[i];
    citySelect.add(option);
  }
};