录制的GIF动画
![mark](http://qiniu.newthink.cc/blog/20171012-180843781.gif)
部分源码如下:
```
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
</head>
<body>
<select onblur="get_city(this)" id="province" name="province" title="请选择所在省份">
<option value="">选择省份</option>
<volist name="province" id="vo">
<option value="{$vo.id}">{$vo.name}</option>
</volist>
</select>
<select onblur="get_area(this)" id="city" name="city" title="请选择所在城市">
<option value="">选择城市</option>
</select>
<select id="district" name="district" title="请选择所在区县">
<option value="">选择区域</option>
</select>
</body>
</html>
<script>
/**
* 获取城市
* @param t 省份select对象
*/
function get_city(t){
var parent_id = $(t).val();
if(!parent_id > 0){
return;
}
$('#district').empty().css('display','none');
$('#twon').empty().css('display','none');
var url = '/admin/test/getRegion/level/2/parent_id/' + parent_id;
$.ajax({
type : "GET",
url : url,
error: function(request) {
alert("服务器繁忙, 请联系管理员!");
return;
},
success: function(v) {
v = '<option value="0">选择城市</option>'+ v;
$('#city').empty().html(v);
}
});
}
/**
* 获取地区
* @param t 城市select对象
*/
function get_area(t){
var parent_id = $(t).val();
if(!parent_id > 0){
return;
}
$('#district').empty().css('display','inline');
$('#twon').empty().css('display','none');
var url = '/admin/test/getRegion/level/3/parent_id/' + parent_id;
$.ajax({
type : "GET",
url : url,
error: function(request) {
alert("服务器繁忙, 请联系管理员!");
return;
},
success: function(v) {
v = '<option>选择区域</option>'+ v;
$('#district').empty().html(v);
}
});
}
</script>
```