mobiscroll破解版手机日期时间插件【原创

来源:https://www.sucaihuo.com/js/514.html 2015-09-26 05:56浏览(3296) 收藏

分享一个支持手机浏览的日期插件,支持触屏翻动日期和小时。
mobiscroll破解版手机日期时间插件
分类:日期时间 > 日期控件 难易:中级
查看演示 下载资源 下载积分: 80 积分

HTML

<p>
    <input type="text"   value="" placeholder="日期" id="date" autocomplete="off"/>
</p>
<p>
    <input type="text"   value="" placeholder="日期时间" id="datetime" autocomplete="off"/>
</p>

引入mobiscroll手机相关插件

<script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<link href="mobiscroll/mobiscroll.css" rel="stylesheet" type="text/css">
<script src="mobiscroll/mobiscroll.js" type="text/javascript"></script>

调用mobiscroll

$(function() {
    var opt_date = {
        preset: 'date',
        //日期date
        theme: 'default',
        //皮肤样式
        dateFormat: 'yy-mm-dd',
        // 日期格式
        setText: '确定',
        //确认按钮名称
        cancelText: '取消',
        //取消按钮
        dateOrder: 'yymmdd',
        //面板中日期排列格式
        dayText: '日',
        monthText: '月',
        yearText: '年',
        //面板中年月日文字
    };
    $('#date').mobiscroll(opt_date);
    var opt_datetime = {
        preset: 'datetime',
        //日期date
        theme: 'default',
        //皮肤样式
        dateFormat: 'yy-mm-dd',
        // 日期格式
        setText: '确定',
        //确认按钮名称
        cancelText: '取消',
        //取消按钮
        dateOrder: 'yymmdd',
        //面板中日期排列格式
        minDate: new Date('2015', '10', '01', '20'),
        timeWheels: "HH",
        timeFormat: "HH",
        dayText: '日',
        monthText: '月',
        yearText: '年',
        hourText: '时',
        //面板中年月日文字
    };
    $('#datetime').mobiscroll(opt_datetime);
})
标签: mobiscroll
声明:本文为原创文章,如需转载,请注明来源sucaihuo.com并保留原文链接:https://www.sucaihuo.com/js/514.html
评论0
头像

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

1 2