jQuery移动触屏下拉选择插件【原创

来源:https://www.sucaihuo.com/js/2534.html 2017-07-25 11:52浏览(4881) 收藏

网上好多移动端下拉都是单下拉或者联动下拉,很少有双向下拉和多项下拉的,这个移动端插件经常应用在商城,比如选择尺寸、属性和购买数量。
jQuery移动触屏下拉选择插件
分类:手机特效 > 下拉框 难易:中级
查看演示 下载资源 下载积分: 120 积分

单项选择

<div id="trigger1">单项选择</div>
var weekdayArr = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
//只有trigger 和 wheels 是必要参数  其他都是选填参数
var mobileSelect1 = new MobileSelect({
    trigger: '#trigger1',
    title: '单项选择',
    wheels: [
        {data: weekdayArr}
    ],
    position: [2] //初始化定位 打开时默认选中的哪个  如果不填默认为0
});

双项选择

var timeArr = ['08:30', '09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30', '19:00', '19:30', '20:00', '20:30', '21:00'];
var mobileSelect2 = new MobileSelect({
    trigger: '#trigger2',
    title: '双项选择',
    wheels: [
        {data: weekdayArr},
        {data: timeArr}
    ],
    position: [1, 2]
});
标签: 弹出层下拉
声明:本文为原创文章,如需转载,请注明来源sucaihuo.com并保留原文链接:https://www.sucaihuo.com/js/2534.html
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2