日付範囲ピッカー（ブートストラップ用JavaScriptコンポーネント）は、特定の日に間違った日付を選択します

Question

現在、私は著者ではないコードで作業しています。ユーザーは非常に具体的な問題を発見しました。 。

このページでは、Date Range Pickerコンポーネントを使用して2つの日付（開始日と終了日）を選択しています。

誰かが16/10/2016日に具体的にクリックするたびに、自動的に17/10/2016に移動します。

これは複数のコンピュータとブラウザでテストされても効果がないため、デバッガで問題をトレースすることもできませんでした。

他の日、任意の月、任意の年、何も問題はありません。それは、16/10/2016日にのみ発生し、その日付が終了日である場合にのみ、問題のない開始日になります。

現在のバージョン：

<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> 

、スクリプト：ここでは2.1.24

で使用されるコードである私がすることができたchiliNUTにより投稿されたリンクに基づいて

$('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

問題を特定します。 これは夏時間の終了に関連していました。 ユーザーが時間を選択すると、問題が解決されます。 これは、$().daterangepicker({ })設定のオプション"timePicker": true を使用して実行できます。

ありがとうございました。

Answer 2

これに追加するつもりですが、それは役に立ちますが、私はOPの答えを+1しました。

他にも追加できる機能がいくつかあります。それは誤って設定されていても、自動更新を使用せず、タイムゾーンは影響を与えません。

$(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"); 
     } 
    }); 
}); 

DEMO：https://jsfiddle.net/norcaljohnny/kensoubf/