2

我正在为引导程序使用日期范围选择器插件,我需要将日期时间范围设置为最大 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 小时)

如何使用插件实现这一点?

4

1 回答 1

2

我将为 oninput 创建一个事件侦听器,根据 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">

编辑:bootstrap daterangepicker 已经具有此功能的内置功能。

于 2017-09-27T10:13:01.313 回答