仅对特定控件显示JQuery Datepicker Today按钮

Question

我们的应用程序中有多个日期选择器。但我们希望只在一页中显示"今日"按钮。

我们如何仅向特定控件显示"今日"按钮？

我尝试了以下选项：1） 在日期选择器的beforeshow中添加了类

 beforeShow: function (input, inst) {
            $('#ui-datepicker-div .ui-datepicker-current').addClass('repositoryDate');
        }

2） 我还尝试将类直接添加到日期选择器中

 $("#val_effective_date").datepicker({
        showOn: 'both',
        dateFormat: 'dd-MM-yy',
        buttonImage: glSiteName + '/Content/Images/Icons/Calendar.png',
        buttonImageOnly: true,
        showButtonPanel: true,
        buttonText: 'Currrent Date',
        changeMonth: true,
        changeYear: true,
        altFormat: 'yymm',
        minDate: new Date($("#createdDate").val()),
        maxDate: new Date(9999, 12, 31),
        //onClose: function (dateText, inst) {
        //    $(this).datepicker('setDate', new Date());
        //},
        onChangeMonthYear: function (y, m, i) {
            var d = i.selectedDay;
            $(this).datepicker('setDate', new Date(y, m - 1, OnMonthYearChangeDateCheck(d, m - 1, y)));
        },
        beforeShow: function (input,inst) {
            $('#ui-datepicker-div .ui-datepicker-current').addClass('dataValidationDate');
        }
    }).next('.ui-datepicker-current').addClass('repositoryDate')

然后在css中添加以下样式

.repositoryDate{
visibility:visible
}

Answer 1

这正是您想要的：检查这个Fiddle。

HTML

<p>Without today button</p>
<input class="datepicker hide_today" type="text">
<p>Without done button</p>
<input class="datepicker hide_done" type="text">
<p>With both buttons</p>   
<input class="datepicker" type="text">

JS

$(".datepicker").datepicker({
    showButtonPanel: true,
    beforeShow: function(ele, obj) {
        obj.dpDiv.removeClass("hide_today hide_done");
        if($(ele).hasClass("hide_today")) obj.dpDiv.addClass("hide_today");
        if($(ele).hasClass("hide_done")) obj.dpDiv.addClass("hide_done"); 
    }
});

CSS

.hide_today .ui-datepicker-buttonpane button:first-child
{
    display: none;
}
.hide_done .ui-datepicker-buttonpane button:last-child
{
    display: none;
}

Answer 2

你可以这样做：（基于您的代码）在beforeShow上：（在没有Today的所有日期选择者中）

 beforeShow: function (input,inst) {
   todayBtnHandler();
 }

function todayBtnHandler(){
    setTimeout(function() {
               $(".ui-datepicker-current").hide();}, 50);    
              }
}

工作小提琴