Question

在标准的jquery.ui.datepicker小部件上，只有一个用于选择月份的下一个和上一个按钮。如果我启用年份，它将显示在选择框中。

在日历的两面实现两个按钮的好方法是什么？一个用于选择下个月，另一个用于选择明年，在右侧彼此相邻显示，并对当前左侧的前一个按钮执行相同操作。

$(function() {
  $("#dp").datepicker({changeYear: true});
})

Answer 1

我找到的最佳解决方案是将Leniel的答案与其他一些属性结合起来，这是我的日期元素的代码

jQuery(document).ready(function(){
    jQuery('input.date').each(function(){
        jQuery(this).datepicker({dateFormat:'dd/mm/yy', changeMonth: true,    stepMonths: 12, showAnim:"slideDown" });
        jQuery('#ui-datepicker-div .ui-helper-hidden-accessible').css("position", "absolute !important");
        jQuery('#ui-datepicker-div').css('clip', 'auto');
    });

希望这能帮助别人，就像它对我一样！

P.S。其他的东西是这样的，因为日期选择器适用于所有浏览器（即6 +，ff3 +，chrome4 +，safari，opera）

Answer 2

如果您只想替换“下一个”和“上一个”按钮的当前行为，以便在单击它们时再转到另一年，则可以使用StepMonths选项：

$( ".selector" ).datepicker({ stepMonths: 12 });

Answer 3

在javascript文件中查看prev / next按钮的创建位置。

<a class="ui-datepicker-prev ui-corner-all" onclick="DP_jQuery_1329396041654.datepicker._adjustDate('#datepicker', -1, 'M');" title="Prev"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>

以上是生成的prev按钮的示例。

您需要做的只是创建具有以下内容的上一个/下一个按钮：

_adjustDate('#datepicker',-1,'Y');
_adjustDate('#datepicker',+1,'Y');

作为他们的功能。检查http://jqueryui.com/demos/datepicker/dropdown-month-year.html处的样本并使用上一页按钮上的firefox / chrome'visument元素 - 将其调整为使用'Y'而不是'M'，您将看到它是如何工作的。

希望这有帮助！

jquery ui datepicker下一年和前一年

3 个答案: