省市联动选择

来源:互联网 发布:手机淘宝淘金币在哪里 编辑:程序博客网 时间:2024/06/05 16:42

<select id="province" onclick="toProvince();">                <option value="" selected>请选择省</option>            </select>            <select id="city">                <option value="" selected>请选择市</option>            </select>

region--json:

var region = { "0": { "code": "11", "name": "北京", "city": [{ "name": "北京", "code": "1101" }] }, "1": { "code": "12", "name": "天津", "city": [{ "name": "天津", "code": "1201" }] }};


获取时的处理:

//将获得的省市的code转换为中文function getName(province,city) {    var pro_name='';    var city_name='';    for(var j in region){        if(province == region[j].code){            pro_name = region[j].name;        }        for(var k in region[j].city){            if(city == region[j].city[k].code){                city_name = region[j].city[k].name;            }        }    }    return pro_name+city_name;}init();//点击可以选择省//获得省市的code(修改时用到),将其填入select中document.getElementById('province').value=province.code;toProvince();document.getElementById('city').value=cit.code;

对region的使用处理方法:

//省function init(){    var _province=document.getElementById("province");    for(var e in region){        var opt_1=new Option(region[e].name,region[e].code);        _province.add(opt_1);    }}//市function toProvince(){    var _province=document.getElementById("province");    var _city=document.getElementById("city");    var v_province=_province.value;    _city.options.length=1;    for(var e in region){        if(region[e].code==v_province){            for( var p in region[e].city){                var opt_2=new Option(region[e].city[p].name,region[e].city[p].code);                _city.add(opt_2);            }            break;        }    }}
 
原创粉丝点击