日期范围选择器 - 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小时）

如何使用插件实现此目的？

来源

2017-09-27 Tango

您是否希望小于，大于或等于24小时？ –

等于24小时。如果开始日期时间是27/9/2017 3:40 PM，则结束日期时间为28/9/2017 3:40 PM – Tango

我会为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已经有一个内置的功能，此功能。

来源

2017-09-27 10:13:01

非常感谢。完美的作品。 – Tango

日期范围选择器 - 24小时范围选择

回答

相关问题