https://www.mobiscroll.com/
https://github.com/xfhxbb/LCalendar
<h1 id="温馨提示强烈建议使用httpsgithubcomzhoushengmufciosselect">温馨提示：强烈建议使用：<a href="https://github.com/zhoushengmufc/iosselect" target="_blank">https://github.com/zhoushengmufc/iosselect
<h1 id="不建议使用">
<a name="t1" target="_blank">不建议使用
<h2 id="demo下载链接httpdownloadcsdnnetdetailcometwo9376336">
<a name="t2" target="_blank">demo下载链接：<a href="http://download.csdn.net/detail/cometwo/9376336" target="_blank">http://download.csdn.net/detail/cometwo/9376336
mobiscroll 扩展：
一个国产轻量级的httpdownloadcsdnnetdetailcometwo9394560"> 上一个国产轻量级的：
<head>
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> charset=<span class="hljs-string">"UTF-8">
<title>手机<a href="https://www.jb51.cc/tag/shijianxuanze/" target="_blank" class="keywords">时间选择</a></title>
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> content=<span class="hljs-string">"initial-scale=1.0,maximum-scale=1.0,width=device-width" name=<span class="hljs-string">"viewport">
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name=<span class="hljs-string">"apple-touch-fullscreen" content=<span class="hljs-string">"YES">
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name=<span class="hljs-string">"format-detection" content=<span class="hljs-string">"telephone=no">
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name=<span class="hljs-string">"apple-mobile-web-app-capable" content=<span class="hljs-string">"yes">
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> name=<span class="hljs-string">"apple-mobile-web-app-status-bar-style" content=<span class="hljs-string">"black">
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> http-equiv=<span class="hljs-string">"Expires" content=<span class="hljs-string">"-1">
<<a href="https://www.jb51.cc/tag/Meta/" target="_blank" class="keywords">Meta</a> http-equiv=<span class="hljs-string">"pragram" content=<span class="hljs-string">"no-cache">
<link rel=<span class="hljs-string">"stylesheet" href=<span class="hljs-string">"css/reset.css" />
<link rel=<span class="hljs-string">"stylesheet" href=<span class="hljs-string">"css/bootstrap.min.css" />
<link rel=<span class="hljs-string">"stylesheet" href=<span class="hljs-string">"css/common.css" />
<link rel=<span class="hljs-string">"stylesheet" href=<span class="hljs-string">"css/info_self.css" />
<script src=<span class="hljs-string">"js/jquery-1.11.1.min.js"></script>
<!--手机日期-->
<script src=<span class="hljs-string">"js/mobiscroll.core-2.5.2.js" <span class="hljs-keyword">type=<span class="hljs-string">"text/javascript"></script>
<script src=<span class="hljs-string">"js/mobiscroll.core-2.5.2-zh.js" <span class="hljs-keyword">type=<span class="hljs-string">"text/javascript"></script>
<link href=<span class="hljs-string">"css/mobiscroll.core-2.5.2.css" rel=<span class="hljs-string">"stylesheet" <span class="hljs-keyword">type=<span class="hljs-string">"text/css" />
<link href=<span class="hljs-string">"css/mobiscroll.animation-2.5.2.css" rel=<span class="hljs-string">"stylesheet" <span class="hljs-keyword">type=<span class="hljs-string">"text/css" />
<script src=<span class="hljs-string">"js/mobiscroll.datetime-2.5.1.js" <span class="hljs-keyword">type=<span class="hljs-string">"text/javascript"></script>
<script src=<span class="hljs-string">"js/mobiscroll.datetime-2.5.1-zh.js" <span class="hljs-keyword">type=<span class="hljs-string">"text/javascript"></script>
<!-- S 可根据自己喜好引入样式风格文件 -->
<script src=<span class="hljs-string">"js/mobiscroll.android-ics-2.5.2.js" <span class="hljs-keyword">type=<span class="hljs-string">"text/javascript"></script>
<link href=<span class="hljs-string">"css/mobiscroll.android-ics-2.5.2.css" rel=<span class="hljs-string">"stylesheet" <span class="hljs-keyword">type=<span class="hljs-string">"text/css" />
</head>
<script <span class="hljs-keyword">type=<span class="hljs-string">"text/javascript">
$(function() {
<span class="hljs-keyword">var currYear = (<span class="hljs-keyword">new Date()).getFullYear();
<span class="hljs-keyword">var opt = {};
opt.datetime = {
preset: <span class="hljs-string">'datetime'
};
opt.<span class="hljs-keyword">default = {
theme: <span class="hljs-string">'android-ics light',<span class="hljs-comment">//皮肤样式
<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play: <span class="hljs-string">'modal',<span class="hljs-comment">//<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>方式 ：modal（正中央） b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om（<a href="https://www.jb51.cc/tag/dibu/" target="_blank" class="keywords">底部</a>）
mode: <span class="hljs-string">'scroller',<span class="hljs-comment">//日期选择模式
lang: <span class="hljs-string">'zh',startYear: currYear - <span class="hljs-number">5,<span class="hljs-comment">//开始年份currYear-5不起作用的原因是加了minDate: new Date()
endYear: currYear + <span class="hljs-number">5,<span class="hljs-comment">//结束年份
<span class="hljs-comment">//minDate: new Date() //<a href="https://www.jb51.cc/tag/jiashang/" target="_blank" class="keywords">加上</a>这句话会导致startYear:currYear-5失效，去掉就可以激活startYear:currYear-5,};
$(<span class="hljs-string">"#appDate").<span class="hljs-keyword">val(<span class="hljs-string">'').scroller(<span class="hljs-string">'destroy').scroller($.extend(opt[<span class="hljs-string">'date'],opt[<span class="hljs-string">'default']));
<span class="hljs-keyword">var optDateTime = $.extend(opt[<span class="hljs-string">'datetime'],opt[<span class="hljs-string">'default']);
$(<span class="hljs-string">"#appDateTime1").mobiscroll(optDateTime).datetime(optDateTime);
});
</script>
<body>
<h1>之所以可以<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>上下午是<a href="https://www.jb51.cc/tag/xiugai/" target="_blank" class="keywords">修改</a>了源<a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a>mobiscroll.datetime-<span class="hljs-number">2.5<span class="hljs-number">.1-zh.js</h1>
<dd <span class="hljs-keyword">class=<span class="hljs-string">"info_list mt10">
<span <span class="hljs-keyword">class=<span class="hljs-string">"in<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a> lable_tit" style=<span class="hljs-string">"color: red;font-size: 25px;"><a href="https://www.jb51.cc/tag/shijianxuanze/" target="_blank" class="keywords">时间选择</a></span>
<div <span class="hljs-keyword">class=<span class="hljs-string">"in<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a> input_w">
<input <span class="hljs-keyword">type=<span class="hljs-string">"text" <a href="https://www.jb51.cc/tag/required/" target="_blank" class="keywords">required</a> name=<span class="hljs-string">"VisitTime" id=<span class="hljs-string">"appDateTime1" <span class="hljs-keyword">class=<span class="hljs-string">"select_w" />
<i <span class="hljs-keyword">class=<span class="hljs-string">"red">*</i>
</div>
</dd>
<h2><a href="https://www.jb51.cc/tag/xiugai/" target="_blank" class="keywords">修改</a>后的<a href="https://www.jb51.cc/tag/wenjian/" target="_blank" class="keywords">文件</a></h2>
<pre>
(function ($) {
$.mobiscroll.i18n.zh = $.extend($.mobiscroll.i18n.zh,{
dateFormat: <span class="hljs-string">'yyyy-mm-dd',dateOrder: <span class="hljs-string">'yymmdd',dayNames: [<span class="hljs-string">'周日',<span class="hljs-string">'周一;',<span class="hljs-string">'周二;',<span class="hljs-string">'周三',<span class="hljs-string">'周四',<span class="hljs-string">'周五',<span class="hljs-string">'周六'],dayNamesShort: [<span class="hljs-string">'日',<span class="hljs-string">'一',<span class="hljs-string">'二',<span class="hljs-string">'三',<span class="hljs-string">'四',<span class="hljs-string">'五',<span class="hljs-string">'六'],dayText: <span class="hljs-string">'日',hourText: <span class="hljs-string">'时',minuteText: <span class="hljs-string">'分',monthNames: [<span class="hljs-string">'一月',<span class="hljs-string">'二月',<span class="hljs-string">'三月',<span class="hljs-string">'四月',<span class="hljs-string">'五月',<span class="hljs-string">'六月',<span class="hljs-string">'七月',<span class="hljs-string">'八月',<span class="hljs-string">'九月',<span class="hljs-string">'十月',<span class="hljs-string">'十一月',<span class="hljs-string">'十二月'],monthNamesShort: [<span class="hljs-string">'1月',<span class="hljs-string">'2月',<span class="hljs-string">'3月',<span class="hljs-string">'4月',<span class="hljs-string">'5月',<span class="hljs-string">'6月',<span class="hljs-string">'7月',<span class="hljs-string">'8月',<span class="hljs-string">'9月',<span class="hljs-string">'10月',<span class="hljs-string">'11月',<span class="hljs-string">'12月'],monthText: <span class="hljs-string">'月',secText: <span class="hljs-string">'秒',timeFormat: <span class="hljs-string">'HH:ii',timeWheels: <span class="hljs-string">'HHii',yearText: <span class="hljs-string">'年',ampmText:<span class="hljs-string">'上午/下午',timeFormat: <span class="hljs-string">'A',timeWheels: <span class="hljs-string">'A'
});
})(jQuery);
未修改的文件
(function ($) {
$.mobiscroll.i18n.zh = $.extend($.mobiscroll.i18n.zh,yearText: <span class="hljs-string">'年'
});
})(jQuery);</pre> <h2>mobiscroll简单配置参数</h2> <pre> <span class="hljs-comment">//下面注释部分是上面的参数可以替换改变它的样式 <span class="hljs-comment">//希望一起研究<a href="https://www.jb51.cc/tag/chajian/" target="_blank" class="keywords">插件</a>的朋友加我个人QQ:1010305129也可以，本人也建个群 291464597 欢迎进群交流。哈哈。这个不能算广告。 <span class="hljs-comment">// 直接写参数<a href="https://www.jb51.cc/tag/fangfa/" target="_blank" class="keywords">方法</a> <span class="hljs-comment">//$("#scroller").mobiscroll(opt).date(); <span class="hljs-comment">// Shorthand for: $("#scroller").mobiscroll({ preset: 'date' }); <span class="hljs-comment">//具体参数定义如下 <span class="hljs-comment">//{ <span class="hljs-comment">//preset: 'date',//日期类型--datatime --time,<span class="hljs-comment">//theme: 'ios',//皮肤其他参数【android-ics light】【android-ics】【ios】【jqm】【sense-ui】【sense-ui】【sense-ui】 <span class="hljs-comment">//【wp light】【wp】 <span class="hljs-comment">//mode: "scroller",//操作方式【scroller】【clickpick】【mixed】 <span class="hljs-comment">//<a href="https://www.jb51.cc/tag/dis/" target="_blank" class="keywords">dis</a>play: 'bubble',//<a href="https://www.jb51.cc/tag/xianshi/" target="_blank" class="keywords">显示</a>方【modal】【inline】【bubble】【top】【b<a href="https://www.jb51.cc/tag/ott/" target="_blank" class="keywords">ott</a>om】 <span class="hljs-comment">//dateFormat: 'yyyy-mm-dd',// 日期格式 <span class="hljs-comment">//setText: '确定',//确认按钮<a href="https://www.jb51.cc/tag/mingcheng/" target="_blank" class="keywords">名称</a> <span class="hljs-comment">//cancelText: '清空',//取消按钮名籍我 <span class="hljs-comment">//dateOrder: 'yymmdd',//面板中日期排列格 <span class="hljs-comment">//dayText: '日',<span class="hljs-comment">//monthText: '月',<span class="hljs-comment">//yearText: '年',//面板中年月日<a href="https://www.jb51.cc/tag/wenzi/" target="_blank" class="keywords">文字</a> <span class="hljs-comment">//startYear: (new Date()).getFullYear(),//开始年份 <span class="hljs-comment">//endYear: (new Date()).getFullYear() + 9,//结束年份 <span class="hljs-comment">//show<a href="https://www.jb51.cc/tag/Now/" target="_blank" class="keywords">Now</a>: true,<span class="hljs-comment">//<a href="https://www.jb51.cc/tag/Now/" target="_blank" class="keywords">Now</a>Text: "明天",// <span class="hljs-comment">//showOnFocus: false,<span class="hljs-comment">//height: 45,<span class="hljs-comment">//width: 90,<span class="hljs-comment">//rows: 3,<span class="hljs-comment">//minDate: new Date() 从当前年，当前月，当前日开始} </pre> </body>
//下面注释部分是上面的参数可以替换改变它的样式
//希望一起研究插件的朋友加我个人QQ:1010305129也可以，本人也建个群 291464597 欢迎进群交流。哈哈。这个不能算广告。
// 直接写参数方法
//$("#scroller").mobiscroll(opt).date();
// Shorthand for: $("#scroller").mobiscroll({ preset: 'date' });
//具体参数定义如下
//{
//preset: 'date',//theme: 'ios',//皮肤其他参数【android-ics light】【android-ics】【ios】【jqm】【sense-ui】【sense-ui】【sense-ui】
//【wp light】【wp】
//mode: "scroller",//操作方式【scroller】【clickpick】【mixed】
//display: 'bubble',//显示方【modal】【inline】【bubble】【top】【bottom】
//dateFormat: 'yyyy-mm-dd',// 日期格式
//setText: '确定',//确认按钮名称
//cancelText: '清空',//取消按钮名籍我
//dateOrder: 'yymmdd',//面板中日期排列格
//dayText: '日',//monthText: '月',//yearText: '年',//面板中年月日文字
//startYear: (new Date()).getFullYear(),//开始年份
//endYear: (new Date()).getFullYear() + 9,//结束年份
//showNow: true,//NowText: "明天",//
//showOnFocus: false,//height: 45,//width: 90,//rows: 3,//minDate: new Date() 从当前年，当前月，当前日开始}
//下面注释部分是上面的参数可以替换改变它的样式
//希望一起研究插件的朋友加我个人QQ:1010305129也可以，本人也建个群 291464597 欢迎进群交流。哈哈。这个不能算广告。
// 直接写参数方法
//$("#scroller").mobiscroll(opt).date();
// Shorthand for: $("#scroller").mobiscroll({ preset: 'date' });
//具体参数定义如下
//{
//preset: 'date',//theme: 'ios',//皮肤其他参数【android-ics light】【android-ics】【ios】【jqm】【sense-ui】【sense-ui】【sense-ui】
//【wp light】【wp】
//mode: "scroller",//操作方式【scroller】【clickpick】【mixed】
//display: 'bubble',//显示方【modal】【inline】【bubble】【top】【bottom】
//dateFormat: 'yyyy-mm-dd',// 日期格式
//setText: '确定',//确认按钮名称
//cancelText: '清空',//取消按钮名籍我
//dateOrder: 'yymmdd',//面板中日期排列格
//dayText: '日',//monthText: '月',//yearText: '年',//面板中年月日文字
//startYear: (new Date()).getFullYear(),//开始年份
//endYear: (new Date()).getFullYear() + 9,//结束年份
//showNow: true,//NowText: "明天",//
//showOnFocus: false,//height: 45,//width: 90,//rows: 3,//minDate: new Date() 从当前年，当前月，当前日开始}
