日期范围选择器 - 24小时范围选择
问题描述:
我正在使用Date Range Picker插件进行引导,我需要启用日期时间范围,最长为24小时。日期范围选择器 - 24小时范围选择
下面的例子可以让我选择的时间范围:
<input type="text" name="daterange" value="" />
<script type="text/javascript">
$(function() {
$('input[name="daterange"]').daterangepicker({
timePicker: true,
timePickerIncrement: 30,
locale: {
format: 'MM/DD/YYYY h:mm A'
}
});
});
</script>
在选择了开始日期和时间,结束日期应该从开始日期和时间24小时。 (限制结束日期和时间从开始日期时间到24小时)
如何使用插件实现此目的?
答
我会为oninput创建一个事件监听器,用于测试enddate和startdate unix时间戳,然后如果它更大,则将其从输入时间恢复为24小时。代码片段即将推出...
$('#demo').daterangepicker({
"linkedCalendars": false,
timePicker: true,
dateLimit: { hours: 24 },
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/2.1.25/daterangepicker.css" rel="stylesheet"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/2.1.25/daterangepicker.js"></script>
<input type="text" id="demo">
编辑:引导daterangepicker已经有一个内置的功能,此功能。
+1
非常感谢。完美的作品。 – Tango
您是否希望小于,大于或等于24小时? –
等于24小时。如果开始日期时间是27/9/2017 3:40 PM,则结束日期时间为28/9/2017 3:40 PM – Tango