首页 > 代码库 > 三级联动
三级联动
1、如图:制作一个三级城市联动
2、步骤:①定义数据,数据肯定是一个大的json对象{key,value}形式的,只要明确了这一点就可以一级级的把省、市、县展开了。如图:
②待页面加载完毕,定义两个变量:一个用来接收当前选定的省,一个用来接收选定的市,var pro, city;
③遍历CITYS数据,获取省,使用$.each(遍历对象,function(index,el){});
④当省发生改变时,市也跟着改变,$("#province").on("change",function(){}); 先得到选定的省值,pro = $("#province option:selected").text(); 再清空市县的值,$("#city").empty(); $("#county").empty(); 然后使用$.each(CITYS[pro],function(k,v){}); 遍历CITYS[pro]并获取市,最后获取完市值,需要出发市的change事件,即使用triggerHandler(‘change‘)
⑤获取县值,步骤同④
⑥在进入页面不手动改变省市时需要系统出发省市的change,即获取省市县的默认值。$("#province").triggerHandler(‘change‘); $("#city").triggerHandler(‘change‘);
三级联动
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。