在web前端input,时间组件很常用,最近在使用layui的时间组件时,想用一个时间段,让后面的时间必须大于前面的时间
<div class="layui-col-xs8">
<div class="layui-inline">
<label for="u_phone">下注时间 ≥:</label>
<div class="layui-input-inline">
<input type="text" name="start_time" class="layui-input" id="start_time" placeholder="开始时间(修改时间)">
</div>
</div>
-
<div class="layui-inline">
<div class="layui-input-inline">
<input type="text" name="end_time" class="layui-input" id="end_time" placeholder="结束时间(修改时间)">
</div>
</div>
</div>
<script type="text/javascript" src="../layui/layui.js"></script>
<script type="text/javascript">
layui.use([ 'laydate'], function(){
var $ = layui.$;
var laydate = layui.laydate;
var nowTime = new Date().valueOf();
var max = null;
var start = laydate.render({
elem: '#start_time',
type: 'datetime',
format:'yyyy/MM/dd',
max: nowTime,
btns: ['clear', 'confirm'],
done: function(value, date){
endMax = end.config.max;
end.config.min = date; //最大时间为结束时间的开始值
end.config.min.month = date.month -1;
}
});
var end = laydate.render({
elem: '#end_time',
type: 'datetime',
max: 4073558400000,
format:'yyyy/MM/dd',
min:nowTime,
done: function(value, date){
if($.trim(value) == ''){
var curDate = new Date();
date = {'date': curDate.getDate(), 'month': curDate.getMonth()+1, 'year': curDate.getFullYear()};
}
start.config.max = date;//最小时间为开始时间的最大值
start.config.max.month = date.month -1;
}
})
})
</script>