jQuery UI日期选择器今天链接

Question

我正在一个项目中使用jQuery UI日期选择器，但需要在用户单击今天按钮时将日期输入到文本字段中。默认情况下，它只选择日期但不将其输入到字段中。我猜这只需要快速修改我的jQuery UI文件，但我该改变什么？谢谢。

编辑：我尝试过这个：http://dev.jqueryui.com/ticket/4045，但它不起作用！

- Cameron

---

有更新吗？需要此功能尽快完成以供项目使用。谢谢。 - Cameron

Answer 1

我在这里找到了一个有效的解决方案：http://forum.jquery.com/topic/jquery-ui-datepicker-today-button。只需使用这个jQuery代码段（我将其与我的datepicker初始化代码一起使用）：

$('button.ui-datepicker-current').live('click', function() {
    $.datepicker._curInst.input.datepicker('setDate', new Date()).datepicker('hide');
});

我遇到的唯一问题是在点击“今天”按钮后，焦点仍然停留在输入框中，这意味着您无法再次单击以选择其他日期。可以通过添加 blur() 来解决此问题：

$('button.ui-datepicker-current').live('click', function() {
    $.datepicker._curInst.input.datepicker('setDate', new Date()).datepicker('hide').blur();
});

我也不喜欢“今天”按钮的样式 - 也许只是我的主题或其他原因，但与“完成”按钮相比，“今天”按钮有点灰暗。可以使用以下CSS进行修复（对于不同的主题可能会有所变化，我不确定）：

/* This edit gives five levels of specificity, thus making it override other styles */
.ui-datepicker div.ui-datepicker-buttonpane button.ui-datepicker-current {
    font-weight: bold;
    opacity: 1;
    filter:Alpha(Opacity=100);
}

- jackocnr

---

你所提供的 CSS 代码，只有在我加入 .ui-datepicker 前缀后才能正常工作（.ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-current）。 - Niels Ziegler

@Niels，那是因为特定规则的缘故。我会编辑A以反映适当的特定性。 - jcolebrand

适用于最新版本1.8.16的Jquery。许多其他的黑客/覆盖已经过时并且不起作用。 - IAmGroot

Answer 2

我知道这个回复有点晚了，但我最近遇到了这个问题，解决方案非常有效。

然而，按钮样式问题是由jQuery UI类引起的。我将以下代码添加到日期文本输入的单击操作中：

$('.date').click(function() {
    $('button.ui-datepicker-current').removeClass('ui-priority-secondary').addClass('ui-priority-primary');
});

这将移除错误的类，并向按钮添加正确的类，使其与“完成”按钮相同。 使用什么主题都不重要。 为了完整起见，这是我整个的代码:

$('.date').datepicker({
    dateFormat: 'yy-mm-dd',
    showButtonPanel: true
}).click(function() {
    $('button.ui-datepicker-current').removeClass('ui-priority-secondary').addClass('ui-priority-primary');
});
$('button.ui-datepicker-current').live('click', function() {
    $.datepicker._curInst.input.datepicker('setDate', new Date()).datepicker('hide').blur();
});

只需添加一个<input type="text" class="date" value="" />，就可以开始使用了。

- AvanOsch

---

感谢提供这个 - 它很有帮助。不过，我注意到在点击“今天”按钮后，它又变成了灰色。有什么想法可以防止这种情况发生吗？ - J Weezy

点击“下一个/上一个月”会导致“今天”按钮恢复到旧样式。最终我使用了CSS覆盖的方法。用ui-priority-secondary替换ui-priority-primary的想法似乎是一种合乎逻辑的方法，但由于JQuery datepicker重新创建按钮而被击败。 - Loathing