Mobiscroll — 配合jQuery Mobile 的日期选择控件附DEMO

港控/mmm° 2022-08-24 11:54 167阅读 0赞

官方demo:http://demo.mobiscroll.com/

<script type="text/javascript" src="../../mweb_js/jquery-1.9.1.js"></script>
    
    <script type="text/javascript" src="../../mweb_js/datepicker/mobiscroll.core-2.5.2.js"></script>
    <script type="text/javascript" src="../../mweb_js/datepicker/mobiscroll.core-2.5.2-zh.js"></script>
    <link type="text/css" rel="stylesheet" href="../../mweb_css/datepicker/mobiscroll.core-2.5.2.css"/>
    <link type="text/css" rel="stylesheet" href="../../mweb_css/datepicker/mobiscroll.animation-2.5.2.css"/>
    <script type="text/javascript" src="../../mweb_js/datepicker/mobiscroll.datetime-2.5.1.js"></script>
    <script type="text/javascript" src="../../mweb_js/datepicker/mobiscroll.datetime-2.5.1-zh.js"></script>
    
    <link type="text/css" rel="stylesheet" href="../../mweb_css/datepicker/mobiscroll.android-ics-2.5.2.css"/>
    <script type="text/javascript" src="../../mweb_js/datepicker/mobiscroll.android-ics-2.5.2.js"></script>
    <script type="text/javascript">
      $(function () {
          var currYear = (new Date()).getFullYear();  
          var opt={};
          opt.date = {preset : 'date'};
          //opt.datetime = { preset : 'datetime', minDate: new Date(2012,3,10,9,22), maxDate: new Date(2014,7,30,15,44), stepMinute: 5  };
          opt.datetime = {preset : 'datetime'};
          opt.time = {preset : 'time'};
          opt.default = {
            theme: 'android-ics light', //皮肤样式
            display: 'modal', //显示方式 
            mode: 'scroller', //日期选择模式
            dateFormat: 'yyyy-mm-dd', // 日期格式    
            lang:'zh',
            startYear:currYear - 100, //开始年份
            endYear:currYear, //结束年份
            onSelect:function(){
              setEndDate();//点击确认后函数
            }
          };
          $("#effe_date").val('').scroller('destroy').scroller($.extend(opt['date'], opt['default']));
          var optDateTime = $.extend(opt['datetime'], opt['default']);
          var optTime = $.extend(opt['time'], opt['default']);
      });
    </script>

![Center][]

[插件下载][Link 1]

[插件下载-破解附demo][-_demo]

[Center]: /images/20220823/63d51eb700404dbfad027ea09e153050.png
[Link 1]: http://download.csdn.net/detail/u010730458/7612637
[-_demo]: http://download.csdn.net/detail/u010730458/8942303

发表评论取消回复

表情：

评论列表（有 0 条评论，167人围观）

还没有评论，来说两句吧...

相关阅读

相关日期选择控件

视图： <tr class="TrDisplay"> <th>开业年份：</th> <td colspan="3">

ゝ一世哀愁。/ 2023年08月17日 16:18/ 0 赞/ 89 阅读

相关 jquery城市选择控件_jQuery选择插件

jquery城市选择控件 ![jQuery Chosen Plugin][] Without a doubt, my least favorite form element

╰+攻爆jí腚メ/ 2023年02月21日 14:25/ 0 赞/ 142 阅读

相关 Qt dateEdit 选择日期控件

课设要求图形化界面，使用 Qt Designer 设计了UI，PyQt5转为.py文件，并在此基础上进行了一些UI方面改进。笔记一则。控件UI设计初始需求就是

川长思鸟来/ 2022年10月10日 11:14/ 0 赞/ 716 阅读

相关 jquery datepicker-强大的日期控件

jquery datepicker-强大的日期控件 [admin][] 五月 25, 2013 [Jquery][] [ 1 条评论][1] 在we

小鱼儿/ 2022年08月27日 04:57/ 0 赞/ 251 阅读

相关 Mobiscroll — 配合jQuery Mobile 的日期选择控件附DEMO

官方demo:http://demo.mobiscroll.com/ <script type="text/javascript" src="../../mw

港控/mmm°/ 2022年08月24日 11:54/ 0 赞/ 168 阅读

相关 jquery中文日期控件演示

下载地址：http://download.csdn.net/download/z83986976/8002113 样式 ![SouthEast][] 代码引入下

向右看齐/ 2022年08月13日 00:38/ 0 赞/ 200 阅读

相关 mobiscroll插件滑动时间选择效果

![70][] 此插件的特点是可以适用于手机端滑动选择时间，类似于原生插件下载地址 [https://download.csdn.net/download/lianzha

末蓝、/ 2022年05月23日 10:26/ 0 赞/ 301 阅读

相关 jquery中文日期控件

前提：导入jquery-2.0.3.min.js，jquery-ui-1.10.3.full.min.js，jquery-ui-1.10.3.full.min.css

妖狐艹你老母/ 2022年04月21日 19:00/ 0 赞/ 272 阅读

相关日期控件控制日期选择

详见 [http://www.my97.net//demo/resource/2.4.asp][http_www.my97.net_demo_resource_2.4.asp]

男娘i/ 2022年01月06日 15:45/ 0 赞/ 471 阅读

相关 Mobiscroll控件动态绑定数据

用Mobiscroll 可实现IOS系统自带的选择器控件效果，支持几乎所有的移动平台(IOS, Android, BlackBerry, Windows Phone 8, Am

怼烎@/ 2021年09月12日 07:52/ 0 赞/ 474 阅读