在jquery datepicker的标题中显示当前日期

Question

如何在jquery datepicker 的标题中显示当前的完整日期,如下所示:

05 July 2015 因为它只是告诉我 July 2015

Answer 1

您可以在onSelect中使用这样的函数

function showDateInTitle(picker) {
    var span = picker.dpDiv[0].querySelector('.ui-datepicker-day'),
        df, month;
    if (span === null) {
        month = picker.dpDiv[0].querySelector('.ui-datepicker-month');
        if (!month) return;
        span = document.createElement('span');
        span.setAttribute('class', 'ui-datepicker-day');
        df = document.createDocumentFragment();
        df.appendChild(span);
        df.appendChild(document.createTextNode('\u00a0'));
        month.parentNode.insertBefore(
            df,
            month
        );
    }
    span.textContent = picker.selectedDay;
}

在选择之前,仍然会在显示datepicker之后通过API查找处理程序

你可以实现一个afterShow如这里所描述有轻微的修改来获得实例

$(function() {
    $.datepicker._updateDatepicker_original = $.datepicker._updateDatepicker;
    $.datepicker._updateDatepicker = function(inst) {
        $.datepicker._updateDatepicker_original(inst);
        var afterShow = this._get(inst, 'afterShow');
        if (afterShow)
            afterShow.apply((inst.input ? inst.input[0] : null), [inst]);
    }
});

现在DEMO

Answer 2

我找不到一种非 hacky 的方法，但是将默认配置更改为您想要显示的文本可能会为您做到这一点：

var defaults = {
  monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ]
};

var today = new Date();
var month = today.getMonth();
defaults.monthNames[month] = today.getDate() + ' ' +  defaults.monthNames[month];

$.datepicker.setDefaults(defaults);

这是一个工作plnkr：http://plnkr.co/edit/gfp95VOchd4fhQOktIL3 ?p=preview