JS特效代码--省市联动下拉菜单

JavaScript07

JS特效代码--省市联动下拉菜单,第1张

<script language="vbscript" >

public x( ) x( )="东城 西城 崇文 宣武 朝阳 丰台 石景山 海淀 门头沟 房山 通州 顺义 昌平 大兴 平谷 怀柔 密云 延庆" x( )="黄浦 卢湾 徐汇 长宁 静安 普陀 闸北 虹口 杨浦 闵行 宝山 嘉定 浦东 金山 松江 青浦 南汇 奉贤 崇明" x( )="和平 东丽 河东 西青 河西 津南 南开 北辰 河北 武清 红挢 塘沽 汉沽 大港 宁河 静海 宝坻 蓟县" x( )="万州 涪陵 渝中 大渡口 江北 沙坪坝 九龙坡 南岸 北碚 万盛 双挢 渝北 巴南 黔江 长寿 綦江 潼南 铜梁 大足 荣昌 壁山 梁平 城口 丰都 垫江 武隆 忠县 开县 云阳 奉节 巫山 巫溪 石柱 秀山 酉阳 彭水 江津 合川 永川 南川" x( )="石家庄 邯郸 邢台 保定 张家口 承德 廊坊 唐山 秦皇岛 沧州 衡水" x( )="太原 大同 阳泉 长治 晋城 朔州 吕梁 忻州 晋中 临汾 运城" x( )="呼和浩特 包头 乌海 赤峰 呼伦贝尔 阿拉善盟 通辽 兴安盟 乌兰察布 锡林郭勒盟 巴彦淖尔 鄂尔多斯" x( )="沈阳 大连 鞍山 抚顺 本溪 丹东 锦州 营口 阜新 辽阳 盘锦 铁岭 朝阳 葫芦岛" x( )="长春 吉林 四平 辽源 通化 白山 松原 白城 延边" x( )="哈尔滨 齐齐哈尔 牡丹江 佳木斯 大庆 绥化 鹤岗 鸡西 黑河 双鸭山 伊春 七台河 大兴安岭" x( )="南京 镇江 苏州 南通 扬州 盐城 徐州 连云港 常州 无锡 宿迁 泰州 淮安" x( )="杭州 宁波 温州 嘉兴 湖州 绍兴 金华 衢州 舟山 台州 丽水" x( )="合肥 芜湖 蚌埠 马鞍山 淮北 铜陵 安庆 黄山 滁州 宿州 池州 淮南 巢湖 阜阳 六安 宣城 亳州" x( )="福州 厦门 莆田 三明 泉州 漳州 南平 龙巖 宁德" x( )="南昌市 景德镇 九江 鹰潭 萍乡 新馀 赣州 吉安 宜春 抚州 上饶" x( )="济南 青岛 淄博 枣庄 东营 烟台 潍坊 济宁 泰安 威海 日照 莱芜 临沂 德州 聊城 滨州 菏泽" x( )="郑州 开封 洛阳 平顶山 安阳 鹤壁 新乡 焦作 濮阳 许昌 漯河 三门峡 南阳 商丘 信阳 周口 驻马店 济源" x( )="武汉 宜昌 荆州 襄樊 黄石 荆门 黄冈 十堰 恩施 潜江 天门 仙桃 随州 咸宁 孝感 鄂州" x( )="长沙 常德 株洲 湘潭 衡阳 岳阳 邵阳 益阳 娄底 怀化 郴州 永州 湘西 张家界" x( )="广州 深圳 珠海 汕头 东莞 中山 佛山 韶关 江门 湛江 茂名 肇庆 惠州 梅州 汕尾 河源 阳江 清远 潮州 揭阳 云浮" x( )="南宁 柳州 桂林 梧州 北海 防城港 钦州 贵港 玉林 南宁地区 柳州地区 贺州 百色 河池" x( )="海口 三亚" x( )="成都 绵阳 德阳 自贡 攀枝花 广元 内江 乐山 南充 宜宾 广安 达川 雅安 眉山 甘孜 凉山 泸州" x( )="贵阳 六盘水 遵义 安顺 铜仁 黔西南 毕节 黔东南 黔南" x( )="昆明 大理 曲靖 玉溪 昭通 楚雄 红河 文山 思茅 西双版纳 保山 德宏 丽江 怒江 迪庆 临沧" x( )="拉萨 日喀则 山南 林芝 昌都 阿里 那曲" x( )="西安 宝鸡 咸阳 铜川 渭南 延安 榆林 汉中 安康 商洛" x( )="兰州 嘉峪关 金昌 白银 天水 酒泉 张掖 武威 定西 陇南 平凉 庆阳 临夏 甘南" x( )="银川 石嘴山 吴忠 固原" x( )="西宁 海东 海南 海北 黄南 玉树 果洛 海西" x( )="乌鲁木齐 石河子 克拉玛依 伊犁 巴音郭勒 昌吉 克孜勒苏柯尔克孜 博尔塔拉 吐鲁番 哈密 喀什 和田 阿克苏" x( )="" x( )="" x( )="台北 高雄 台中 台南 屏东 南投 云林 新竹 彰化 苗栗 嘉义 花莲 桃园 宜兰 基隆 台东 金门 马祖 澎湖"

lishixinzhi/Article/program/Java/JSP/201311/20384

(1)var provs={},存储省市的json结构数据。

(2)function loadProv() {},此函数实现了初始化页面加载数据的功能。

(3)var prov = document.getElementById("prov"),获取存放省份的select下拉菜单。

(4)for (var key in provs),遍历json结构数据。

(5)var provName = key,获取省份的名称。

(6)var optProv = document.createElement("option"),创建一个option元素对象。

(7)optProv.value = provName,设置option元素的value属性值。

(8)optProv.innerText = provName,设置option显示的文本内容。

(9)prov.appendChild(optProv),将option元素添加到select下拉菜单。

(10)function provChange() {},作为onchange事件处理函数。

(11)var prov = document.getElementById("prov"),获取省份下拉菜单。

(12)var city = document.getElementById("city"),获取城市下拉菜单。

(13)var provName = prov.value,获取当前选中的省份的value值。

(14)if (provName == "none") {

city.style.display = "none"

return

},如果值等于none,说明选中的是第一项,那么城市下拉菜单还是具有隐藏状态,并跳出函数。

(15)else {

city.style.display = ""

},否则的话显示出城市下拉菜单,默认状态它是隐藏的。

(16)var citys = provs[provName],获取城市,citys是个数组。

(17)for (var index = city.childNodes.length - 1index >= 0index--) {

var child = city.childNodes[index]

city.removeChild(child)

},遍历城市下拉菜单下的option元素,然后删除这些元素。

之所以清空就是为了防止当再次加载的时候出现累加情况。

(18)for (var index = 0index <citys.lengthindex++) {},遍历数组中的元素,也就是城市。

(19)var optCity = document.createElement("option"),创建option元素。

(20)optCity.value = citys[index],设置option元素的value值。

(21)optCity.innerText = citys[index],设置option元素的文本内容。

(22)city.appendChild(optCity),将option元素添加select下拉菜单。

数据表形式数据

json形式数据