原生 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>
评论
172条评论232啊 Lv.1 回复
江西省南昌市 电信
sun展乐 Lv.1 回复
吧吧吧吧吧啊
山东省青岛市 联通
小来 Lv.1
Safari 15.1
Mac OS X 10.15.6 回复
牛逼
香港 北京康盛新创科技有限责任公司
爱忘事的小家伙 Lv.1 回复
哈
江苏省 移动
爱忘事的小家伙 Lv.1 回复
看看
江苏省 移动
a' 索尼克 Lv.1 回复
感谢分享
山东省青岛市 移动
pony Lv.2
Chrome 91.0.4472.77
Windows 回复
妙妙妙妙妙妙妙妙妙妙妙妙妙妙妙妙妙妙妙
贵州省黔东南州 电信
浅魄云(6xi.top)j2zy.cn Lv.1
Chrome 88.0.4324.93
Windows 回复
广东省深圳市 联通
hhhd Lv.1 回复
可以用?
福建省厦门市 联通
452 Lv.1 回复
看看
河北省石家庄市 移动