j查询日期选取器不显示时间输入值

jQuery datepicker not showing time input value

本文关键字:显示 时间 输入 查询 日期 选取      更新时间:2023-09-26

我目前正在开发一个网站,其中包含一个日期选择器以及日期和时间。对于时间指示器,我使用了"jquery datepicker addon"。但是,问题是,日期选择器不会更新他的小时/时间输入值。因此,当您选择日期时,日期输入会更新并显示日期选取器(检查元素)的值,但不显示时间输入的值。您可以通过检查代码来查看这一点。

请参阅打印屏幕:http://nl.tinypic.com/r/35816jb/8

该 HTML 代码:

<p>Date: <input type="text" name="datumtijd-aanduiding" id="datumtijd-aanduiding" value=""/> On: <input type="text" name="datumtijd-aanduiding-tijd" id="datumtijd-aanduiding-tijd" value=""/></p>

到目前为止的JS代码:

$( document ).ready(function() {
$("#datumtijd-aanduiding").datepicker({
        dateFormat: "DD, d MM yy",
        onSelect: function (dateText, instance) {
            $('#datumtijd-aanduiding').text(this.value);
            var date = $.datepicker.parseDate("DD, d MM yy", dateText);
            var isWeekendHours = !$.datepicker.noWeekends(date)[0];
            if (isWeekendHours) {
                $("#datumtijd-aanduiding-tijd").removeClass("hasDatepicker");
                $("#datumtijd-aanduiding-tijd").timepicker({
                    hourMin: 12,
                    hourMax: 17,
                    stepMinute: 5,
                    timeOnly: true,
                    timeFormat: "HH:mm"
                });
            } else {
                $("#datumtijd-aanduiding-tijd").removeClass("hasDatepicker");
                $("#datumtijd-aanduiding-tijd").timepicker({
                    hourMin: 8,
                    hourMax: 22,
                    stepMinute: 5,
                    timeOnly: true,
                    timeFormat: "HH:mm"
                });
            }
        },
        //set options
        minDate: 0,
        numberOfMonths: 1,
        showButtonPanel: true,
        changeMonth: true,
        changeYear: false,
        selectWeek: true
    }).datepicker("setDate", "0");
 });

和工作jsfiddle链接:http://goo.gl/G6bK9I

我在使用日期范围选择器时遇到了同样的问题

我用了

$('#startDate').daterangepicker({
    singleDatePicker: true,
    timePicker: true,
    locale: {
        format: 'MM/DD/YYYY h:mm A'
    }
});