只要敢于大开脑洞,答案是肯定的!
首先可以借助市面上的手机号查询接口获取一些地理信息,比如:
IP138查询网手机号查询:http://user.ip138.com/mobile/doc/
利用简单的api调用就可以获取到地区信息
http://api.ip138.com/mobile/?mobile=13209760000&datatype=jsonp&callback=find&token=cc87f3c77747bccbaaee35006da1ebb65e0bad57
返回的数据接口
{
"ret": "ok", // ret 值为 ok 时 返回 data 数据 为err时返回msg数据
"mobile": "13209760000", // 手机号
"data": [
"青海", // 省会或直辖市
"海西", // 地区或城市
"联通130卡",// 卡类型
"0977", // 城市区号
"632800", // 行政区划代码
]
}
可以看出,接口中包含了许多信息,而我们要用的就是里面的"行政区划代码"。原因在于,首先地理的文本信息不利于数据库存储,且不包含级联关系;其次,市面上的城市三级联动插件就是按"行政区划代码"关联的。
在这里需要普及下什么是"行政区划代码"
关于行政区划代码
使用《中华人民共和国行政区划代码》国家标准(GB/T2260). 这部分可分为三个层次,从左到右的含义分别是:
- 第一、二位表示省(自治区、直辖市、特别行政区)
- 第三、四位表示市(地区、自治州、盟及国家直辖市所属市辖区和县的汇总码)
- 第五、六位表示县(市辖区、县级市、旗).
比如厦门市思明区的区划代码为:350203,可以通过简单的运算得出其省级代码为:350000(福建),市级代码为:350200(厦门)。
有了统一的规范,就可以利用代码区初始化城市三级联动插件了!下面介绍一个很好用的jQuery插件
城市三级联动插件演示:http://jquerywidget.com/jquery-citys/
同样简单
HTML结构:
<div id="demo">
<select name="province"></select>
<select name="city"></select>
<select name="area"></select>
</div>
接口调用:
$('#demo').citys({nodata:'hidden',code:350206});
同时也可以通过名称初始化
$('#demo').citys({province:'福建',city:'厦门',area:'思明'});
补充:推荐一个离线的 ip 地区获取 https://git.oschina.net/lionsoul/ip2region