jQuery移动端联动下拉日期选择插件mobile.js

所属分类:输入-日期和时间

 23837  237  查看评论 (9)
分享到微信朋友圈
X
jQuery移动端联动下拉日期选择插件mobile.js ie兼容10

1.普通数组格式-非联动

<div id="trigger1"></div> <!--页面中别漏了这个trigger-->
<script>
    var mobileSelect1 = new MobileSelect({
        trigger: '#trigger1',
        title: '日期选择',
        wheels: [
            {data:_data}
        ],
        transitionEnd:function(indexArr, data){
            console.log(data);
        },
        callback:function(indexArr, data){
            console.log(data);
            $("#trigger1").val(data[0].value+'-'+data[1].value+'-'+data[2].value)
        }
    });
</script>

2.json格式-非联动

<div id="trigger2"></div>
<script>
    var mobileSelect1 = new MobileSelect({
        trigger: '#trigger2',
        title: '地区选择',
        wheels: [
            {data:[
                    {id:'1',value:'附近'},
                    {id:'2',value:'上城区'},
                    {id:'3',value:'下城区'},
                    {id:'4',value:'江干区'},
                    {id:'5',value:'拱墅区'},
                    {id:'6',value:'西湖区'}
                ]}
        ],
        transitionEnd:function(indexArr, data){
            console.log(data);
        },
        callback:function(indexArr, data){
            console.log(data);
            $("#trigger2").val(data[0].value)
        }
    });
</script>

3.json格式-联动

<div id="trigger3"></div>
相关插件-日期和时间

jquery移动端日期选择插件mobiscroll3.0.0

jquery移动端日期选择插件mobiscroll3.0.0APP日期选择器
  日期和时间
 57580  300

时间插件lhgcalendar

lhgcalendar是一功能强大的简单迷你并且高效的弹出日历组件,基于网络访问并且兼容IE 6.0+,Firefox 3.0+,Opera 9.6+,Chrome 1.0+,Safari 3.22+.
  日期和时间
 43492  283

Canvas时钟插件clock-canvas.js

使用html5中Canvas技术,绘制钟表表盘,表面大小支持自适应。
  日期和时间
 22478  265

原生JS仿Mac OS日历

原生JS仿Mac OS日历,简洁美观
  日期和时间
 34307  308

讨论这个项目(9)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    不完美而完美 0
    2019/12/4 15:02:11
    怎么在天数后面追加时分的? 回复
    mangosala 0
    2019/8/14 16:13:40
    怎么控制显示的列数呢 回复
    王笑笑 0
    2019/7/19 16:10:46
    我透你猴子,1981年以前的年份选不了
        SgHBoOm0
        2019/8/10 0:17:03
        有个模板给你用,你自己不会动脑解决?
        BattleofLexington1
        2019/8/10 2:28:09
        你把index.html中所有1980改你想要的最少值就行了。
    回复
    凌晨风 0
    2019/7/11 14:37:54
    默认没有显示当前日期 回复
    凌晨风 0
    2019/7/11 14:31:43
    如何设置默认定位的日期? 回复
      0
    2019/6/5 12:59:57
    怎么获取到他的数据
        [!..!]1
        2019/6/26 15:33:05
        transitionEnd: function(indexArr, data) {
                console.log(data);
            },
            callback: function(indexArr, data) {
                console.log(data);
                $("#trigger2").val(data[0].value)
            }

        这里面console 的值就是选择的内容

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复