嗞嗞嗞~ 你的浏览器仿佛在对我微笑!

YDUI Touch Docs 返回首页

CitySelect

1、说明

1.1、示例:http://m.ydui.org/html/cityselect.html

1.2、移动端中国省市县级联插件;CitySelect 仅支持Javascript API方式调用;

2、调用

普通调用

需在ydui.js前引入数据文件 ydui.citys.js

数据文件 ydui.citys.js 是从京东偷取的数据,点击这里可获取最新数据;

通过 [open] 方法打开弹窗;

通过 done.ydui.cityselect 自定义事件获取当前选择的省/市/县。

<input type="text" readonly id="J_Address" placeholder="请选择收货地址">

<script src="//static.ydcss.com/uploads/ydui/ydui.citys.js"></script>
<script>
var $address = $('#J_Address');

$address.citySelect();

$address.on('click', function () {
$address.citySelect('open');
});

$address.on('done.ydui.cityselect', function (ret) {
/* 省:ret.provance */
/* 市:ret.city */
/* 县:ret.area */
$(this).val(ret.provance + ' ' + ret.city + ' ' + ret.area);
});
</script>
设置默认地址

设置初始默认值。

<input type="text" readonly id="J_Address2" placeholder="请选择收货地址" value="新疆 乌鲁木齐市 天山区">

<script src="http://static.ydcss.com/uploads/ydui/ydui.citys.js"></script>
<script>
var $target = $('#J_Address2');

$target.citySelect({
provance: '新疆',
city: '乌鲁木齐市',
area: '天山区'
});

$target.on('click', function () {
$target.citySelect('open');
});

$target.on('done.ydui.cityselect', function (ret) {
$(this).val(ret.provance + ' ' + ret.city + ' ' + ret.area);
});
</script>

3、参数

参数说明类型可选值默认值
provance 默认【省】 String - -
city 默认【市】 String - -
area 默认【县】 String - -

4、参与讨论

4.1、有任何使用问题,请在评论中留言,也欢迎大家发表意见、建议。感谢您对YDUI的支持。