这里只是使用layui的日期模块,所以,我只引入了laydate相关文件;
1.首选引入laydate.js和laydata.css:
<link href="css/laydate.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="js/laydate.js"></script>
2.html部分(input样式我自己定义的)
<input class="date_class" type="text" id="startTime" /> <input class="date_class" type="text" id="endTime" />
3.js部分:
<script type="text/javascript"> var startDate = laydate.render({ elem: '#startTime', //指定元素 type: 'date', max: getNowFormatDate(), done: function(value, dates) { endDate.config.min = { year: dates.year, month: dates.month - 1, //关键 date: dates.date, hours: 0, minutes: 0, seconds: 0 }; // 开始日期 console.log(value); } }); var endDate = laydate.render({ elem: '#endTime', //指定元素 type: 'date', max: getNowFormatDate(), done: function(value, dates) { // 结束日期 console.log(value); } }); // 获取当前的日期时间 格式“yyyy-MM-dd HH:MM:SS” function getNowFormatDate() { var date = new Date(); var seperator1 = "-"; var seperator2 = ":"; var month = date.getMonth() + 1; var strDate = date.getDate(); if (month >= 1 && month <= 9) { month = "0" + month; } if (strDate >= 0 && strDate <= 9) { strDate = "0" + strDate; } var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + " " + date.getHours() + seperator2 + date.getMinutes() + seperator2 + date.getSeconds(); return currentdate; } </script>
效果图:
以上;