js联动三级
自己研究三级加看网上的例子得出来的
<select id="province">
<option value="">----请选择----</option>
</select>省份
<select id="city">
<option value="">----请选择----</option>
</select>市
<select id="country">
<option value="">----请选择----</option>
</select>区
var city =[
['合肥','宿州','淮北','阜阳','蚌埠','淮南','滁州','马鞍山','芜湖','铜陵','安庆','黄山','六安','池州','宣城','亳州'],
['广州','深圳','清远','韶关','河源','梅州','潮州','汕头','揭阳','汕尾','惠州','东莞','珠海','中山','江门','佛山','肇庆','云浮','阳江','茂名','湛江']];
var country =[[['合肥1','合肥2'],['宿州1','宿州2'],['淮北1','淮北2'],['阜阳1','阜阳2'],['蚌埠1','蚌埠2'],['淮南1','淮南2']
,['滁州1','滁州2'],['马鞍山1','马鞍山2'],['芜湖1','芜湖2'],['铜陵1','铜陵2'],['安庆','安庆2'],['黄山','黄山2']
,['六安1','六安2'],['池州1','池州2'],['宣城1','宣城2'],['亳州1','亳州2']],[['广州1','广州2'],['深圳1','深圳2']
,['清远','清远2'],['韶关1','韶关2'],['河源1','河源2'],['梅州1','梅州2'],['潮州1','潮州2'],['汕头1','汕头2']
,['揭阳1','揭阳2'],['汕尾1','汕尾'],['惠州1','惠州2'],['东莞1','东莞2'],['珠海1','珠海2'],['中山1','中山2']
,['江门1','江门2'],['佛山1','佛山2'],['肇庆1','肇庆2'],['云浮1','云浮2'],['阳江1','阳江2'],['茂名1','茂名2']
,['湛江1','湛江2']]];
$(function(){
for(var i in province){
$("#province").append('<option>'+province[i]+'</option>');
}
$("#province").change(function(){
$("#city").children().not(':eq(0)').remove();//选择其他省的时候,把之前内容清空掉
$("#country").children().not(':eq(0)').remove();//这个步骤是为了,当你选择其他省市区选好后,你选别的其他省区是不会清空,
var City=$(this).children("option:selected").index();//取到selected的值
var citys = city[num1-1];
var citys = city[City-1]; //为什么要City-1呢 因为市里面的要与省的相对于,我们打的第一行有个---请选择----,要把它减掉才能对应起来.然后传到city里面,再交到citys遍历出来
for(var i in citys){
$("#city").append("<option>"+citys[i]+"</option>");
}
});
$("#city").change(function(){
$("#country").children().not(":eq(0)").remove();
var Country=$(this).children("option:selected").index();//:selected---查找所有选中的选项元素--
$("select
option:elected")
var countrys = country[Country-1][Country-1];
for(var i in countrys){
$("#country").append("<option>"+countrys[i]+"</option>");
}
})
})
最新文章
- Map的keySet和entrySet
- SharePoint 2013 CSOM creat post in NewsFeed Access Denied
- C#快捷键和注释
- coderforces #384 D Chloe and pleasant prizes(DP)
- Xcode中给控件添加颜色时自动显示出颜色
- Python小爬虫练习
- 黑客语(Leet)
- Assets/Sciprts/GameSciprt.js(97,46): BCE0044: expecting :, found &#39;,&#39;.
- javamail发送邮件的简单实例
- Yii2.0 URL美化
- ASM磁盘组兼容性设置
- ehcache 缓存技术
- HDU 5235 Friends (2015 Multi-University Training Contest 2 搜索+剪枝)
- HTML 网页游戏 2048
- makefile初步制作,arm-linux- (gcc/ld/objcopy/objdump)详解
- [bzoj4864][BeiJing 2017 Wc]神秘物质
- 在java中怎样实现多线程?线程的4种状态
- redis 集群引出hash一致性算法
- 一文让你彻底理解 Java NIO 核心组件
- Android.os.SystemClock
热门文章
- ObjectARX之Mac os开发
- 基于图的异常检测(三):GraphRAD
- 在springboot或者ssm框架或者类似的框架中VO、DTO、DO、PO的概念、区别和用处
- 微信小程序,知识点
- Python获取帮助的3种方式(转载)
- Maven打包插件Assembly(七)
- Codeforces Round #576 (Div. 1)
- [LeetCode] 896. Monotonic Array 单调数组
- Office 2016正式版/2019预览版 使用注意
- python实现的WebSocket客户端