JavaScript省市级联下拉菜单实例
程序员文章站
2023-11-30 11:50:52
最近学了一个关于省市级联简单的小例子,贴出来与大家分享一下:
<...
最近学了一个关于省市级联简单的小例子,贴出来与大家分享一下:
<!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>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
下一篇: vue表单自定义校验规则介绍
推荐阅读
-
JavaScript省市级联下拉菜单实例
-
原生JavaScript实现的简单省市县三级联动功能示例
-
JS实多级联动下拉菜单类,简单实现省市区联动菜单!
-
JavaScript下拉菜单功能实例代码
-
JavaScript省市级联下拉菜单实例
-
JavaScript实现省市县三级级联特效
-
Ajax无刷新技术实现省市县三级联动下拉菜单--Asp.Net
-
.net和javascript 结合 ,生成三级联动无刷新下拉菜单【修改版】 .netJavaScript
-
.net和javascript 结合 ,生成三级联动无刷新下拉菜单【修改版】 .netJavaScript
-
JS实多级联动下拉菜单类,简单实现省市区联动菜单!