mobiscroll 控件的使用(手机端日历控件)

时间：2023-03-09 17:19:13

先上一张图吧：

控件的下载地址：http://www.kuitao8.com/20140604/2615.shtml

文档API地址：http://docs.mobiscroll.com/2-13-2/datetime#!opt-minDate

网卡案例：http://www.wglong.com/main/artical!details?id=11

现在直接贴代码了，

js引用部分：

 <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

     <link href="../../js/mobiscroll-master/css/mobiscroll.scroller.css" rel="stylesheet"

        type="text/css" />

    <link href="../../js/mobiscroll-master/css/mobiscroll.scroller.android-holo.css"

        rel="stylesheet" type="text/css" />

    <script src="../../js/jquery-1.8.3.js" type="text/javascript"></script>

    <script src="../../js/jquery-mobile/jquery.mobile-1.4.2.min.js" type="text/javascript"></script>

    <script src="../../js/mobiscroll-master/js/mobiscroll.core.js" type="text/javascript"></script>

    <script src="../../js/mobiscroll-master/js/mobiscroll.scroller.js" type="text/javascript"></script>

    <script src="../../js/mobiscroll-master/js/mobiscroll.datetime.js" type="text/javascript"></script>

    <script src="../../js/mobiscroll-master/js/i18n/mobiscroll.i18n.zh.js" type="text/javascript"></script>

设置DOM部分：(id和name是我自己设置的，重要部分是class)：

<input name="kssj" id="kssj" type="text" class="demo-test-date1" />

js部分：

 $('.demo-test-date1').mobiscroll().date({

            defaultValue: new Date(kssj),

            preset: 'date', //日期

            dateFormat: 'yy-mm-dd', // 日期格式

            dateOrder: 'yymmdd', //面板中日期排列格式

            theme: 'android-holo', //皮肤样式

            mode: 'scroller', //日期选择模式

            lang: 'zh',

            display: 'modal', //显示方式

            animate: '',

            maxDate: new Date(jssj)

        });

就这样了，有什么不明白的call qq:1576410833

秒客网

mobiscroll 控件的使用(手机端日历控件)

相关文章