打开日期选择器上的今天按钮

Posted

技术标签:

【中文标题】打开日期选择器上的今天按钮【英文标题】:Turn on Today button on date picker 【发布时间】:2013-06-05 04:31:42 【问题描述】:

我正在使用来自此来源 http://jqueryui.com/datepicker/#buttonbar 的日期选择器,我正在尝试让按钮栏上的“今天”按钮处于活动状态,谁能帮助我。

$(".datepicker").datepicker(
            showButtonPanel: true, closeText: 'Clear',
             gotoCurrent : true,
            changeMonth: true,
            changeYear: true,
            yearRange: '1900, 2300',
            dateFormat: _DateFormatDatePicker,             
            onSelect: function (dateText, inst) 
                dateAsString = dateText; //the first parameter of this function
                var dateAsObject = $(this).datepicker('getDate'); //the getDate method
                document.getElementById('<%=hdnTempDate.ClientID%>').value = dateText;
            

【问题讨论】:

这可能会帮助你回答我api.jqueryui.com/datepicker/#option-currentText 你说让它“活跃”是什么意思? 看起来并不简单,看这里:***.com/questions/1073410/… 查看***.com/questions/233553/… 【参考方案1】:

试试这个:

$(".datepicker").datepicker(
    showOn: "button",
    showButtonPanel: true,
    buttonImage: buttonCalendar,
    buttonImageOnly: true,
    buttonText: ""
);

并在您拥有日历的页面中调用此 js 代码。

$.datepicker._gotoToday = function(id)  
    $(id).datepicker('setDate', new Date()).datepicker('hide').blur(); 
;

【讨论】:

感谢$.datepicker._gotoToday = function(id) $(id).datepicker('setDate', new Date()).datepicker('hide').blur(); ; 更正确的是$(id).datepicker('setDate', new Date()).datepicker('hide').blur().change();【参考方案2】:

试试这个

$(function() 
    $( "#datepicker" ).datepicker(
        showButtonPanel: true
    );
);

【讨论】:

【参考方案3】:

通过showButtonPanel: true 启用按钮面板。然后将以下代码放在您的 datepicker JS 代码之后:

var _gotoToday = jQuery.datepicker._gotoToday;
jQuery.datepicker._gotoToday = function(a)
    var target = jQuery(a);
    var inst = this._getInst(target[0]);
    _gotoToday.call(this, a);
    jQuery.datepicker._selectDate(a, jQuery.datepicker._formatDate(inst,inst.selectedDay, inst.selectedMonth, inst.selectedYear));
;

【讨论】:

以上是关于打开日期选择器上的今天按钮的主要内容,如果未能解决你的问题,请参考以下文章

引导日期选择器上的棘手问题

jQueryUI 日期选择器上的焦点事件

日期选择器上的自定义输入字段

为啥 Android 原生 HTML5 日期选择器上的 Chrome 变得非常慢?

在日期选择器上设置日期 jquery ui datepicker

Kendo UI 日期时间选择器 - 选择上/下个月时调用 onclick 函数