JavaScript省市联动案例
2018-04-01 17:25
519 查看
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript"> var cities; window.onload=function(){ //模拟查询所有的城市 cities=[ ["石家庄","保定","廊坊"], ["广州","东莞","佛山"], ["南宁","桂林","玉林"] ]; } function change(){ //获取省份 var select1=document.getElementById("province"); //获取选中省份的序号 var n=select1.value; //获取该省份所对应的城市 var pcities=cities ; //删除旧的城市 var select2=document.getElementById("city"); select2.innerHTML="<option>请选择</option>" //var options=select2.getElementsByTagName("option"); //for(var i=options.length-1;i>0;i--){ // select2.removeChild(options[i]); //} //追加新的城市 if(pcities){ for(var i=0;i<pcities.length;i++){ var option=document.createElement("option"); option.innerHTML=pcities[i]; select2.appendChild(option); } } } </script> </head> <body> 省: <select onchange="change()" id="province"> <option value="-1">请选择</option> <option value="0">河北省</option> <option value="1">广东省</option> <option value="2">广西省</option> </select> 市: <select id="city"> <option>请选择</option> </select> </body> </html>
相关文章推荐
- JavaScript案例六:简单省市联动(NBA版)
- JavaScript案例练习三:省市联动
- JavaScript-省市县三级联动菜单
- 用JavaScript实现省市二级联动
- JavaScript省市联动
- JavaScript实现省市县三级联动效果~~~
- javascript---省市联动封装
- 中国省市区地址三级联动jQuery插件 案例下载
- JavaScript省市县三级联动——善良公社
- 省市区三级联动select下拉框,下拉框数据回显 Demo js脚本实现带脚本与案例,整理好了的下载既可用
- 原生JavaScript实现动态省市县三级联动下拉框菜单实例代码
- JavaScript(JS)实现省市联动选择下拉列表
- \t\t用JavaScript实现省市二级联动
- 省市二级联动小案例讲解
- JavaScript基础——省市联动
- 【原创】省市二级联动纯javascript
- JavaScript省市联动菜单
- javascript制作省市联动等类似二级目录
- 基于javascript实现全国省市二级联动下拉选择菜单