jQuery UI - Datepicker - 隐藏年份

Question

我正在使用jQuery UI 1.8,我想在弹出窗口和文本框中隐藏用户的年份.基本上不是选择日,月和年,而是希望用户只选择日期和月份.

在文本框中隐藏年份很容易,下面显示的代码就是这样做的.我对如何隐藏弹出窗口的年份感到难过 - 所以它会说"四月"而不是"四月2010".

$(function() {
        $("#beginDateRange").datepicker({ dateFormat: 'mm/dd' });
});

<input type="text" name="beginDateRange" id="beginDateRange" />

任何帮助将不胜感激.

Answer 1

我在寻找一个很好的方法时遇到了这个问题,这就是我想出的.

在我的CSS我有一个

.BirthdayDatePicker .ui-datepicker-year
{
 display:none;   
}

这就是我设置我的日期选择器的方式,我不想在今年展示:

$('.DateTextBox.NoYear').datepicker({
            beforeShow: function (input, inst) {

                inst.dpDiv.addClass('BirthdayDatePicker');
            },
            onClose: function(dateText, inst){
                inst.dpDiv.removeClass('BirthdayDatePicker');
            }
        });

基本上我在它显示之前添加了类,并在隐藏它时将其关闭,以便页面上的其他日期选择器不受其影响.

只是因为任何人都需要在页面上的特定选择器上隐藏年份并且不想弄乱jQuery的内部.

Answer 2

我不认为这个选项暴露在api中.我相信最简单的方法是更改​​样式表.将ui-datepicker-year类更改为display: none 另一个选项将是编辑源,以便它根本不呈现,为此,您可以删除这部分代码:

 // year selection
if (secondary || !changeYear)
html += '<span class="ui-datepicker-year">' + drawYear + '</span>';
else {
// determine range of years to display
var years = this._get(inst, 'yearRange').split(':');
var thisYear = new Date().getFullYear();
var determineYear = function(value) {
var year = (value.match(/c[+-].*/) ? drawYear + parseInt(value.substring(1), 10) :
(value.match(/[+-].*/) ? thisYear + parseInt(value, 10) :
parseInt(value, 10)));
return (isNaN(year) ? thisYear : year);
};
var year = determineYear(years[0]);
var endYear = Math.max(year, determineYear(years[1] || ''));
year = (minDate ? Math.max(year, minDate.getFullYear()) : year);
endYear = (maxDate ? Math.min(endYear, maxDate.getFullYear()) : endYear);
html += '<select class="ui-datepicker-year" ' +
'onchange="DP_jQuery_' + dpuuid + '.datepicker._selectMonthYear(\'#' + inst.id + '\', this, \'Y\');" ' +
'onclick="DP_jQuery_' + dpuuid + '.datepicker._clickMonthYear(\'#' + inst.id + '\');"' +
'>';
for (; year <= endYear; year++) {
html += '<option value="' + year + '"' +
(year == drawYear ? ' selected="selected"' : '') +
'>' + year + '</option>';
}
html += '</select>';
}

我没有尝试删除代码,但它应该工作.我确实尝试使用css隐藏它并且确实有效(无论如何在firefox :))

HTH

Answer 3

很老的问题,但我只是需要自己做这个,这是一个可能对某人有用的替代方法; 一个快速而肮脏的修复程序,可以让你的其他日期选择器继续工作,只要你不需要changeYear功能是设置changeYear为true你不想要一年出现的日期选择器,然后添加CSS:

select.ui-datepicker-year { display:none }