Question

这可能是一个基本问题，但我需要知道如何处理这一要求。我们在每个星期一运行selfaudit，我正在开发一个图表来显示细节。用户可以选择不是特定日期而是一周。
如何实施此选项
1）我可以有一个选择选项列表，显示从最近到最旧的星期一（有日期） 2）我可以有一个只启用星期一的日期选择器吗？ - 为此，我可以隐藏日期选择器中的其他日期，而不是将其隐藏起来吗？我正在使用带有timepicker插件的jquery datepicker（http://trentrichardson.com/examples/timepicker/）。

我如何处理此要求？
在此先感谢您

Answer 1

通常，处理方式是允许用户选择任何日期，然后自动选择包含所选日期的一周内的所有日期。有一个例子说明了如何在http://www.tikalk.com/incubator/week-picker-using-jquery-ui-datepicker使用默认的JQuery日期选择器。

相关脚本是：

$(function() {
    var startDate;
    var endDate;

    var selectCurrentWeek = function() {
        window.setTimeout(function () {
            $('.week-picker').find('.ui-datepicker-current-day a').addClass('ui-state-active')
        }, 1);
    }

    $('.week-picker').datepicker( {
        showOtherMonths: true,
        selectOtherMonths: true,
        onSelect: function(dateText, inst) { 
            var date = $(this).datepicker('getDate');
            startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
            endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
            var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
            $('#startDate').text($.datepicker.formatDate( dateFormat, startDate, inst.settings ));
            $('#endDate').text($.datepicker.formatDate( dateFormat, endDate, inst.settings ));

            selectCurrentWeek();
        },
        beforeShowDay: function(date) {
            var cssClass = '';
            if(date >= startDate && date <= endDate)
                cssClass = 'ui-datepicker-current-day';
            return [true, cssClass];
        },
        onChangeMonthYear: function(year, month, inst) {
            selectCurrentWeek();
        }
    });

    $('.week-picker .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
    $('.week-picker .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });
});

提供选项/日期选择器来选择周

1 个答案: