日期范围选择器（JavaScript Bootstrap 的组件）在特定日期选择了错误的日期

Question

目前我一直在使用我不是作者的代码，用户发现了一个非常具体的问题，我根本找不到答案。

相关页面使用 Date Range Picker 组件来选择两个日期（开始和结束）。

只要有人在 16/10/2016 那天特别点击它，它就会自动转移到 17/10/2016。

这在多台计算机和浏览器中进行了测试，没有效果，我也无法通过调试器找到问题所在。

其他任何一天，任何一个月，任何一年，returns 完全没问题。它只发生在 16/10/2016 那天，并且只有当该日期是结束日期时，它才可以是没有问题的开始日期。

当前版本：2.1.24

这里是使用的代码：

<section class="col-md-4"> <!-- Selecionar Datas-->
    <div class="form-group has-feedback has-feedback-right">
        <input type="hidden" id="dt_inicio_afastamento">
        <input type="hidden" id="dt_fim_afastamento">
        <label class="control-label">Escolha o intervalo de datas</label>
        <i class="form-control-feedback glyphicon glyphicon-calendar"></i>
        <input id="escolhe_data" name="escolhe_data" class="input-mini form-control" type="text">
    </div>
</section>

和脚本：

    $('input[name="escolhe_data"]').daterangepicker({
        showDropdowns: true,
        autoApply: true,
        autoUpdateInput: true,
        locale: {
            "format": "DD/MM/YYYY",
            "separator": " - ",
            "applyLabel": "Aplicar",
            "cancelLabel": "Cancelar",
            "fromLabel": "De",
            "toLabel": "Até",
            "customRangeLabel": "Outro",
            "weekLabel": "S",
            "daysOfWeek": ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sab"],
            "monthNames": ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro" ],
            "firstDay": 1
        },
        alwaysShowCalendars: true
    },
    function(start, end, label) {
      //console.log($('#escolhe_data').data());

    });

    $('#escolhe_data').on('apply.daterangepicker', function(ev, picker) {
        $('#dt_inicio_afastamento').val(picker.startDate.format('YYYY-MM-DD'));
        $('#dt_fim_afastamento').val(picker.endDate.format('YYYY-MM-DD'));
    });

Answer 1

根据 chiliNUT 发布的链接，我能够查明问题所在。这与夏令时的结束有关。让用户 select 小时也解决了这个问题。这可以使用选项 "timePicker": true 来完成在 $().daterangepicker({ }) 配置中。

感谢 chiliNUT 和所有帮助过的人！

Answer 2

要添加到这个..以防它有帮助，但我对 OP 答案 +1。

您还可以添加其他一些功能。即不使用autoupdate，时区设置错误也不会影响。

$(function() {
    $('input[name="escolhe_data"]').daterangepicker({
        timePicker: true,
        timePickerIncrement: 30,
        locale: {
            format: 'MM/DD/YYYY h:mm A'
        },
        ranges: {
           'Today': [moment(), moment()],
           'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
           'Last 7 Days': [moment().subtract(6, 'days'), moment()],
           'Last 30 Days': [moment().subtract(29, 'days'), moment()],
           'This Month': [moment().startOf('month'), moment().endOf('month')],
           'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
        }
    });

    $(window).scroll(function() {
        if ($('input[name="daterange"]').length) {
            $('input[name="daterange"]').daterangepicker("close");
      }
    });
});

演示：https://jsfiddle.net/norcaljohnny/kensoubf/

日期范围选择器（JavaScript Bootstrap 的组件）在特定日期选择了错误的日期

Date Range Picker (JavaScript Component for Bootstrap) picks the wrong date on specific day

javascript

jquery

daterangepicker

twitter-bootstrap