我使用jQuery日期选择器在我的应用程序上显示日历。我想知道我是否可以使用它来显示月和年(2010年5月)而不是日历?
当前回答
我知道这个回复有点晚,但几天前我也遇到了同样的问题,我已经有了一个很好的解决方案。 首先,我在这里找到了这个很棒的日期选择器
然后我刚刚更新了CSS类(jquery.calendarPicker.css),它像这样随示例而来:
.calMonth {
/*border-bottom: 1px dashed #666;
padding-bottom: 5px;
margin-bottom: 5px;*/
}
.calDay
{
display:none;
}
当你改变任何东西时,插件会触发一个事件DateChanged,所以你没有点击某一天并不重要(它适合作为年和月选择器)
希望能有所帮助!
其他回答
的事: http://www.mattkruse.com/javascript/calendarpopup/
选择月-选择示例
使用onSelect回调并手动删除年份部分,并手动设置字段中的文本
我还需要一个月份选择器。我做了一个简单的一年在标题和3行4个月下面。jQuery简单的月-年选择器。
对于月份选择器,使用jQuery v1.7.2
我有以下javascript正在做的事情
$l("[id$=txtDtPicker]").monthpicker({
showOn: "both",
buttonImage: "../../images/Calendar.png",
buttonImageOnly: true,
// Default is 'mm/yyyy' and separator char is not mandatory
pattern: 'yyyymm',
monthNames: [
'Jan',
'Fev',
'Mar',
'Abr',
'Mai',
'Jun',
'Jul',
'Ago',
'Set',
'Out',
'Nov',
'Dez'
]
});
我对公认的答案有一定的困难,没有其他答案可以用最小的努力作为基础。因此,我决定对已接受答案的最新版本进行调整,直到它至少满足最低的JS编码/可重用性标准。
这里有一个比第三版(最新版)本·克勒的公认答案更清晰的解决方案。此外,它将:
不仅要使用mm/yy格式,还要使用包括 OP的MM yy。 不隐藏页面上其他日期选择器的日历。 不会用datestr隐式污染全局JS对象, 月、年等变量。
看看吧:
$('.date-picker').datepicker({
dateFormat: 'MM yy',
changeMonth: true,
changeYear: true,
showButtonPanel: true,
onClose: function (dateText, inst) {
var isDonePressed = inst.dpDiv.find('.ui-datepicker-close').hasClass('ui-state-hover');
if (!isDonePressed)
return;
var month = inst.dpDiv.find('.ui-datepicker-month').find(':selected').val(),
year = inst.dpDiv.find('.ui-datepicker-year').find(':selected').val();
$(this).datepicker('setDate', new Date(year, month, 1)).change();
$('.date-picker').focusout();
},
beforeShow: function (input, inst) {
var $this = $(this),
// For the simplicity we suppose the dateFormat will be always without the day part, so we
// manually add it since the $.datepicker.parseDate will throw if the date string doesn't contain the day part
dateFormat = 'd ' + $this.datepicker('option', 'dateFormat'),
date;
try {
date = $.datepicker.parseDate(dateFormat, '1 ' + $this.val());
} catch (ex) {
return;
}
$this.datepicker('option', 'defaultDate', date);
$this.datepicker('setDate', date);
inst.dpDiv.addClass('datepicker-month-year');
}
});
你需要的其他所有东西是下面的CSS:
.datepicker-month-year .ui-datepicker-calendar {
display: none;
}
就是这样。希望以上内容能节省更多读者的时间。