Question

我正在使用jQuery UI的DatePicker在我的网站上为消费者选择出生日期。它目前通过下降显示月份和年份例如，当我将年限限制为-18y时，通过maxDate，月份下降并未显示1993年的所有月份被选中。它只显示直到最长月份的月份。

在可用性测试中，我们发现我们的人口统计信息往往会点击他们出生的月份，然后是年份，然后是当天。

是否可以显示所有月份，即使该月内的日期不可选择？

以下是用于显示DatePicker的代码：

$('.DobWidget').datepicker({
    showOn: 'both',        
    buttonImage: '/media/img/admin/icon_calendar.gif',
    buttonImageOnly: true, 
    dateFormat: js_date_format, // mm/dd/yyyy  
    constrainInput: false, // Handled server-side for type-in.
    changeMonth: true,
    changeYear: true,
    maxDate: '-18y',
    minDate: '-110y',
    showButtonPanel: true,
    onChangeMonthYear: function(year, month, inst) {
        if (inst.currentDay != 0) {     
            $(this).datepicker("setDate", new Date(year, month - 1, inst.currentDay));
        }                  
    }
});

我目前正在使用jQueryUI v.1.8.16和jQuery v.1.6.3，它们都是由Google AJAX API提供的。

Answer 1

修复jquery ui 1.8.17 通过更改jquery代码中的一些内容，我也遇到了这个问题。现在我看到所有月份，我可以选择它们，但是日期仍然是你想要的不可选择的。

在if语句的_generateHTML函数中添加maxDraw.setMonth（'11'）：

if (maxDate) {
            maxDraw = (minDate && maxDraw < minDate ? minDate : maxDraw);
            maxDraw.setMonth('11');
            while (this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1)) > maxDraw) {
                ...
            }
        }

在你更改的else语句的for循环中的_generateMonthYearHeader函数中：

for (var month = 0; month < 12; month++) {
                if ((!inMinYear || month >= minDate.getMonth()) &&
                        (!inMaxYear || month <= maxDate.getMonth()))
                    monthHtml += '<option value="' + month + '"' +
                        (month == drawMonth ? ' selected="selected"' : '') +
                        '>' + monthNamesShort[month] + '</option>';
            }

变为

for (var month = 0; month < 12; month++) {
                if ((!inMinYear || month >= minDate.getMonth()) &&
                        (!inMaxYear || month <= 11))
                    monthHtml += '<option value="' + month + '"' +
                        (month == drawMonth ? ' selected="selected"' : '') +
                        '>' + monthNamesShort[month] + '</option>';
            }

在_restrictMinMax中添加maxDate.setMonth（'11'）：

...
var maxDate = this._getMinMaxDate(inst, 'max');
        maxDate.setMonth('11');
        var newDate = (minDate && date < minDate ? minDate : date);
...

在_isInRange中添加maxDate.setMonth（'11'）：

var minDate = this._getMinMaxDate(inst, 'min');
        var maxDate = this._getMinMaxDate(inst, 'max');
        maxDate.setMonth('11');
...

在选择器中显示日期范围外的月份？

1 个答案: