[更新]修改省市区demo

This commit is contained in:
Anyon 2017-07-10 16:04:47 +08:00
parent 50b3564e21
commit 2cc532a538

View File

@ -164,35 +164,35 @@ require(['citys'], function (ret) {
<pre class="layui-code" lay-title="javascript代码">
require(['citys'], function () {
var $town = $('#demo3 select[name="town"]');
var townFormat = function (info) {
$town.hide().empty();
if (info['code'] % 1e4 && info['code'] < 7e5) {
//是否为“区”且不是港澳台地区
$.ajax({
url: 'http://passer-by.com/data_location/town/' + info['code'] + '.json',
dataType: 'json',
success: function (town) {
$town.show();
for (i in town) {
$town.append('<option value="' + i + '">' + town[i] + '</option>');
}
var $town = $('#demo3 select[name="town"]');
var townFormat = function (info) {
$town.hide().empty();
if (info['code'] % 1e4 && info['code'] < 7e5) {
//是否为“区”且不是港澳台地区
$.ajax({
url: 'http://passer-by.com/data_location/town/' + info['code'] + '.json',
dataType: 'json',
success: function (town) {
$town.show();
for (i in town) {
$town.append('<option value="' + i + '">' + town[i] + '</option>');
}
});
}
};
$('#demo3').citys({
province: '福建',
city: '厦门',
area: '思明',
onChange: function (info) {
townFormat(info);
}
}, function (api) {
var info = api.getInfo();
}
});
}
};
$('#demo3').citys({
province: '福建',
city: '厦门',
area: '思明',
onChange: function (info) {
townFormat(info);
});
}
}, function (api) {
var info = api.getInfo();
townFormat(info);
});
});
</pre>
<script>
require(['citys'], function () {
@ -234,121 +234,121 @@ require(['citys'], function () {
<p style="font-size:18px;line-height:30px;">Options</p>
<table class="layui-table">
<thead>
<tr>
<th width="150">参数</th>
<th width="120">默认值</th>
<th>说明</th>
</tr>
<tr>
<th width="150">参数</th>
<th width="120">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td>dataUrl</td>
<td>[数据库地址]</td>
<td>
<p>最新数据库(
<script src="http://passer-by.com/data_location/version.js"></script>
<a href="http://passer-by.com/data_location/list.json" target="_blank">JSON格式</a>
<a href="http://passer-by.com/data_location/list.jsonp" target="_blank">JSONP格式</a></p>
<p>数据库项目:<a href="https://github.com/mumuy/data_location" target="_blank">中国行政区划(省、市、区、街道)</a></p>
</td>
</tr>
<tr>
<td>dataType</td>
<td>'json'</td>
<td>
<p>数据库类型:'json''jsonp'</p>
<p class="warning">IE9-由于默认安全设置需开启“通过域访问数据源”才能跨域访问json此类情况建议使用jsonp格式</p>
</td>
</tr>
<tr>
<td>crossDomain</td>
<td>true</td>
<td>
<p>是否开启跨域</p>
<p class="warning">IE9-如果设置开启跨域而实际未跨域,造成请求异常</p>
</td>
</tr>
<tr>
<td>provinceField</td>
<td>'province'</td>
<td>省份(省级)字段名</td>
</tr>
<tr>
<td>cityField</td>
<td>'city'</td>
<td>城市(地级)字段名</td>
</tr>
<tr>
<td>areaField</td>
<td>'area'</td>
<td>地区(县区级)字段名</td>
</tr>
<tr>
<td>valueType</td>
<td>'code'</td>
<td>下拉框值的类型,code行政区划代码,name地名</td>
</tr>
<tr>
<td>code</td>
<td>0</td>
<td>地区编码</td>
</tr>
<tr>
<td>province</td>
<td>[]</td>
<td>省份(省级),可以为地区编码或者名称</td>
</tr>
<tr>
<td>city</td>
<td>[]</td>
<td>城市(地级),可以为地区编码或者名称</td>
</tr>
<tr>
<td>area</td>
<td>[]</td>
<td>地区(县区级),可以为地区编码或者名称</td>
</tr>
<tr>
<td>required</td>
<td>true</td>
<td>是否必须选中(是否自动选择地区)</td>
</tr>
<tr>
<td>nodata</td>
<td>'hidden'</td>
<td>当无数据时的表现形式:'hidden'隐藏,'disabled'禁用,为空不做任何处理</td>
</tr>
<tr>
<td>onChange(info)</td>
<td>[]</td>
<td>地区切换时触发,回调函数传入地区信息:direct是否为直辖市,province省份(省级)名称,city城市(地级)名称,area地区(县区级)名称,code地区编码</td>
</tr>
<tr>
<td>dataUrl</td>
<td>[数据库地址]</td>
<td>
<p>最新数据库(
<script src="http://passer-by.com/data_location/version.js"></script>
<a href="http://passer-by.com/data_location/list.json" target="_blank">JSON格式</a>
<a href="http://passer-by.com/data_location/list.jsonp" target="_blank">JSONP格式</a></p>
<p>数据库项目:<a href="https://github.com/mumuy/data_location" target="_blank">中国行政区划(省、市、区、街道)</a></p>
</td>
</tr>
<tr>
<td>dataType</td>
<td>'json'</td>
<td>
<p>数据库类型:'json''jsonp'</p>
<p class="warning">IE9-由于默认安全设置需开启“通过域访问数据源”才能跨域访问json此类情况建议使用jsonp格式</p>
</td>
</tr>
<tr>
<td>crossDomain</td>
<td>true</td>
<td>
<p>是否开启跨域</p>
<p class="warning">IE9-如果设置开启跨域而实际未跨域,造成请求异常</p>
</td>
</tr>
<tr>
<td>provinceField</td>
<td>'province'</td>
<td>省份(省级)字段名</td>
</tr>
<tr>
<td>cityField</td>
<td>'city'</td>
<td>城市(地级)字段名</td>
</tr>
<tr>
<td>areaField</td>
<td>'area'</td>
<td>地区(县区级)字段名</td>
</tr>
<tr>
<td>valueType</td>
<td>'code'</td>
<td>下拉框值的类型,code行政区划代码,name地名</td>
</tr>
<tr>
<td>code</td>
<td>0</td>
<td>地区编码</td>
</tr>
<tr>
<td>province</td>
<td>[]</td>
<td>省份(省级),可以为地区编码或者名称</td>
</tr>
<tr>
<td>city</td>
<td>[]</td>
<td>城市(地级),可以为地区编码或者名称</td>
</tr>
<tr>
<td>area</td>
<td>[]</td>
<td>地区(县区级),可以为地区编码或者名称</td>
</tr>
<tr>
<td>required</td>
<td>true</td>
<td>是否必须选中(是否自动选择地区)</td>
</tr>
<tr>
<td>nodata</td>
<td>'hidden'</td>
<td>当无数据时的表现形式:'hidden'隐藏,'disabled'禁用,为空不做任何处理</td>
</tr>
<tr>
<td>onChange(info)</td>
<td>[]</td>
<td>地区切换时触发,回调函数传入地区信息:direct是否为直辖市,province省份(省级)名称,city城市(地级)名称,area地区(县区级)名称,code地区编码</td>
</tr>
</tbody>
</table>
<p style="font-size:18px;line-height:30px;">callback(api)参数</p>
<table class="layui-table">
<thead>
<tr>
<th width="200">方法</th>
<th>说明</th>
</tr>
<tr>
<th width="200">方法</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td>getInfo(data)</td>
<td>获取当前选中的地区信息:direct是否为直辖市,province省份(省级)名称,city城市(地级)名称,area地区(县区级)名称,code地区编码</td>
</tr>
<tr>
<td>getInfo(data)</td>
<td>获取当前选中的地区信息:direct是否为直辖市,province省份(省级)名称,city城市(地级)名称,area地区(县区级)名称,code地区编码</td>
</tr>
</tbody>
</table>
</div>
<script>
layui.use('code', function () {
layui.code({
encode: true
layui.use('code', function () {
layui.code({
encode: true
});
});
});
</script>
{/block}