Let's take a picture first:
Control's: http://www.kuitao8.com/20140604/2615.shtml
Document API Address: Http://docs.mobiscroll.com/2-13-2/datetime#!opt-minDate
Network card case: http://www.wglong.com/main/artical!details?id=11
Now I'm just pasting the code,
JS Reference section:
<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>
To set the DOM section : (ID and name are set by myself, and the important part is Class):
<input name="kssj" id="kssj " type= " Text"class="demo-test-date1" />
JS section:
$('. Demo-test-date1'). Mobiscroll (). Date ({defaultvalue:NewDate (KSSJ), preset:'Date',//DateDateFormat:'YY-MM-DD',//Date FormatDateOrder:'YYMMDD',//Date arrangement format in panelTheme'Android-holo',//Skin StyleMode'scroller',//Date Selection ModeLang:'ZH', display:'modal',//display ModeAnimate"', MaxDate:NewDate (JSSJ)});
That's it, there's nothing to understand. Call qq:1576410833
Use of the Mobiscroll control (phone-side calendar control)