一、简介
纯原生js的移动端城市选择插件,不依赖任何库
二、用法
在html页面中引入input标签,写法如下:
<input id="demo1" type="text" readonly="" placeholder="城市选择特效" value="广东省,深圳市,南山区"/>
将样式文件引入到页面中:
<link rel="stylesheet" href="css/LArea.css">
同时引入js文件到页面中:
<script src="js/LArea.js"></script>
引入城市数据:
<script src="js/LAreaData1.js"></script>
初始化插件:
var area = new LArea(); area.init({ 'trigger': '#demo1',//触发选择控件的文本框,同时选择完毕后name属性输出到该位置 'valueTo':'#value1',//选择完毕后id属性输出到该位置 'keys':{id:'id',name:'name'},//绑定数据源相关字段 id对应valueTo的value属性输出 name对应trigger的value属性输出 'type':1,//数据源类型 'data':LAreaData//数据源 });
效果图:
插件来源:
DEMO:
移动端三级联动城市选择控件
最好使用移动端访问,扫描下方二维码