原生 js 移动端选择控件,不依赖任何库可传入普通数组或者 json 数组可根据传入的参数长度,自动渲染出对应的列数,支持单项到多项选择自动识别是否级联提供回调函数 onChange() 返回当前选择索引位置、以及选择的数据每次手势滑动结束后,也提供一个回调函数 onTransitionEnd() 返回当前选择索引位置、以及选择的数据能够在已经实例化控件后,提供 update 函数再次渲染,可用于异步获取数据或点击交互后需要改变所选数据的场景提供initValue支持回显场景 <link rel="stylesheet" href="css/mobileSelect.css" media="all" />
<script src="js/mobileSelect.js"></script>
<script>
var mobileSelect4 = new MobileSelect({
trigger: '#trigger4',
title: '请选择',
wheels: [
{data:[
{
id:'1',
value:'分类一',
childs:[
{id:'1',value:'1000米'},
{id:'2',value:'2000米'},
{id:'3',value:'3000米'},
{id:'4',value:'5000米'},
{id:'5',value:'10000米'}
]
},
{id:'2',value:'分类二',
childs:[
{id:'1',value:'嗯嗯'},
{id:'2',value:'嗯嗯'},
{id:'3',value:'让人'},
{id:'4',value:'特'},
{id:'5',value:'尔特'}
]
},
{id:'3',value:'分类三'},
{id:'4',value:'分类4'},
{id:'5',value:'分类5'},
{id:'6',value:'分类6'}
]}
],
connector: " - ",
transitionEnd:function(indexArr, data){
console.log(data);
},
callback:function(indexArr, data){
console.log(JSON.stringify(data));
}
});
</script>
评论
3条评论lssun Lv.5 回复
好实用
广东省东莞市 联通
彭Sir Lv.1 回复
我从未见过如此精彩的内容3445
湖北省武汉市 联通
彭Sir Lv.1 回复
支持一下,黑蜘蛛博客有你更精彩
湖北省武汉市 联通