Блог

Главная - Вопросы по программированию - Проблема в jQuery Datepicker при выборе даты начала и даты окончания

Проблема в jQuery Datepicker при выборе даты начала и даты окончания

#javascript #html #jquery

Вопрос:

Я использую jQuery Datepicker, и у меня те же изменения в jQuery, но в этом что-то пошло не так.

Все работает нормально в соответствии с моими требованиями, но когда я выбираю дату с December 2020 даты начала, чем все даты даты окончания, отключается.

И это происходит только тогда, когда я выбираю даты декабря 2020 года.

 if (jQuery('#datetimepicker1').length > 0) {
    jQuery('#datetimepicker1').datetimepicker({
        lang: 'ch',
        timepicker: false,
        format: 'd/m/Y',
        formatDate: 'Y/m/d',
        maxDate: 0,
        onChangeDateTime: function(dp, $input) {
            var from = $input.val().split("/");
            var f = new Date(from[2], from[1], from[0]);
            f.setDate(f.getDate());
            var datemin = f.getFullYear()  "/"  f.getMonth()  "/"  f.getDate();
            var datestr= from[2]  "/"  f.getMonth()  "/"  from[0];
            $("#datetimepicker2").datetimepicker({
                lang: 'ch',
                timepicker: false,
                format: 'd/m/Y',
                formatDate: 'Y/m/d',
                changeMonth: f.getMonth(),
                changeYear: f.getFullYear(),
                minDate: new Date(datemin),
                startDate:datemin,
            });
        }

    });
}

if (jQuery('#datetimepicker2').length > 0) {
    jQuery('#datetimepicker2').datetimepicker({
        lang: 'ch',
        timepicker: false,
        format: 'd/m/Y',
        formatDate: 'Y/m/d',
        maxDate: 0,
    });
} 
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>


<input id="datetimepicker1" type="text" placeholder="Start Date"/>
<input id="datetimepicker2" type="text" placeholder="End Date"/>

Комментарии:

1. Я предполагаю, что у вас есть путаница между форматами ( Y/m/d и d/m/Y ), так что нет разумной даты, например new Date("03","12","2020") == Mon Jul 12 1909

2. извините за ошибку, проблема, вероятно, в том, что месяц, похоже, будет основан на нуле, например new Date("2019","11","02") == Dec 02 2019

3. @JohnSmith Вы можете предоставить код? где мне нужно переодеться?

Ответ №1:

Месяцы на Javascript 0 основаны, но ваш ввод 1 основан на данных, поэтому вам нужно преобразовать

 var f = new Date(from[2], from[1]-1, from[0]);

Он терпит неудачу, так как нет 13-го месяца, поэтому «запутывается».

Поскольку вы используете не саму дату, а переформатирование обратно в строку, вам также необходимо преобразовать обратно эти строки:

 var datemin = f.getFullYear()  "/"  (f.getMonth() 1)  "/"  f.getDate();
var datestr= from[2]  "/"  (f.getMonth() 1)  "/"  from[0];
 
 if (jQuery('#datetimepicker1').length > 0) {
    jQuery('#datetimepicker1').datetimepicker({
        lang: 'ch',
        timepicker: false,
        format: 'd/m/Y',
        formatDate: 'Y/m/d',
        maxDate: 0,
        onChangeDateTime: function(dp, $input) {
            var from = $input.val().split("/");
            var f = new Date(from[2], from[1]-1, from[0]);
            f.setDate(f.getDate());
            var datemin = f.getFullYear()  "/"  (f.getMonth() 1)  "/"  f.getDate();
            var datestr= from[2]  "/"  (f.getMonth() 1)  "/"  from[0];
            $("#datetimepicker2").datetimepicker({
                lang: 'ch',
                timepicker: false,
                format: 'd/m/Y',
                formatDate: 'Y/m/d',
                changeMonth: f.getMonth(),
                changeYear: f.getFullYear(),
                minDate: new Date(datemin),
                startDate:datemin,
            });
        }

    });
}

if (jQuery('#datetimepicker2').length > 0) {
    jQuery('#datetimepicker2').datetimepicker({
        lang: 'ch',
        timepicker: false,
        format: 'd/m/Y',
        formatDate: 'Y/m/d',
        maxDate: 0,
    });
} 
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>


<input id="datetimepicker1" type="text" placeholder="Start Date"/>
<input id="datetimepicker2" type="text" placeholder="End Date"/>
Метки: