一个移动端的时间选择插件
刚上班几个月的前端菜鸟，自己写一个日期选择是因为包含时分秒的插件不好找，有js厉害的可以给点建议
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>date demo</title>
<style type="text/css">
strong{
font-size: 15px;
}
pre{
padding: 16px 0;
overflow: auto;
line-height: 1.45;
background-color: #f6f8fa;
border-radius: 3px;
}
</style>
</head>
<body>
<pre>
<strong>jquery.date.js</strong>
<b>配置：</b>
//不填则使用默认配置
data-options="{'type':'YYYY-MM-DD hh:mm:ss','beginYear':2010,'endYear':2088}"
<b>调用方式：</b>
$.date('#date');
<b>参数说明：</b>
type--支持的格式
//年月日 时分秒
['YYYY-MM-DD hh:mm:ss','YY-MM-DD hh:mm:ss','YYYY/MM/DD hh:mm:ss','YY/MM/DD hh:mm:ss']
//年月日 时分
['YYYY-MM-DD hh:mm','YY-MM-DD hh:mm','YYYY/MM/DD hh:mm','YY/MM/DD hh:mm']
//年月日
['YYYY-MM-DD','YY-MM-DD','YYYY/MM/DD','YY/MM/DD']
//年月
['YYYY-MM','YY-MM','YYYY/MM','YY/MM']
beginYear -- 开始年份
endYear -- 结束年份，可不填，默认不会小于当前
limitTime--可选 today：今天之前的日期不可选 tomorrow：明天之前的不可选
</pre>
<h3>演示</h3>
<hr>
年月
<br>
<input type="text" id="date" data-options="{'type':'YYYY-MM','beginYear':2010,'endYear':2088}" style="width:166px;height:19px;">
<hr>
年月日
<br>
<input type="text" id="date2" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088}" style="width:166px;height:19px;">
<hr>
年月日 时分
<br>
<input type="text" id="date3" data-options="{'type':'YYYY-MM-DD hh:mm','beginYear':2010,'endYear':2088}" style="width:166px;height:19px;">
<hr>
年月日 时分秒
<br>
<button type="text" id="date4" data-options="{'type':'YYYY-MM-DD hh:mm:ss','beginYear':2010,'endYear':2088}" style="width:170px;height:25px;vertical-align: middle;text-align: left;"></button>
<hr>
时间限制
<br>
<input type="text" id="date5" data-options="{'type':'YYYY-MM-DD','beginYear':2010,'endYear':2088,'limitTime':'today'}" style="width:166px;height:19px;">
<br>
<br>
<br>
<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="https://weijhfly.github.io/js/jquery-1.11.0.min.js"></script>
<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="https://weijhfly.github.io/js/jquery.date.js"></script>
<script>
$.date('#date');
$.date('#date2');
$.date('#date3');
$.date('#date4');
$.date('#date5');
</script>
</body>
</html>点击查看更多内容
22人点赞
评论
共同学习，写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持，我会继续努力的～
扫码打赏，你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫，即可进行扫码打赏哦