Question

使用jQuery datepicker，如何更改显示的年份范围？在jQuery UI网站上，它表示默认为“显示当前年份之前和之后的10年”。我想用这个作为生日选择，而今天10年之前是不行的。这可以使用jQuery datepicker完成，还是我必须使用不同的解决方案？

链接到datepicker演示：http://jqueryui.com/demos/datepicker/#dropdown-month-year

Answer 1

如果你向下看一下演示页面，你会看到一个“限制日期选择器”部分。使用下拉列表指定“Year dropdown shows last 20 years”演示，然后点击查看源：

$("#restricting").datepicker({ 
    yearRange: "-20:+0", // this is the option you're looking for
    showOn: "both", 
    buttonImage: "templates/images/calendar.gif", 
    buttonImageOnly: true 
});

您也希望这样做（显然将-20更改为-100或其他内容。

Answer 2

为什么不显示年份或月份选择框？

$( ".datefield" ).datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange:'-90:+0'
});

Answer 3

其他人没有提到的是你也可以设置硬编码的日期范围：

例如：

yearRange: "1901:2012"

虽然不建议这样做，但它是一个完全有效的选项（如果您合法地寻找目录中的特定年份，例如“1963：1984”），则该选项很有用。 / p>

Answer 4

完美的出生日期（以及我使用的）类似于Shog9所说的，尽管我将给出更具体的DOB示例：

$(".datePickerDOB").datepicker({ 
    yearRange: "-122:-18", //18 years or older up to 122yo (oldest person ever, can be sensibly set to something much smaller in most cases)
    maxDate: "-18Y", //Will only allow the selection of dates more than 18 years ago, useful if you need to restrict this
    minDate: "-122Y"
});

希望未来的googlers发现这很有用：）。

Answer 5

添加@ Shog9发布的内容，您还可以在beforeShowDay：callback函数中单独限制日期。

您提供了一个获取日期并返回布尔数组的函数：

"$(".selector").datepicker({ beforeShowDay: nationalDays}) 
natDays = [[1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'], [4, 27, 'za'], 
[5, 25, 'ar'], [6, 6, 'se'], [7, 4, 'us'], [8, 17, 'id'], [9, 7, 
'br'], [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']]; 
function nationalDays(date) { 
    for (i = 0; i < natDays.length; i++) { 
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == 
natDays[i][1]) { 
        return [false, natDays[i][2] + '_day']; 
      } 
    } 
  return [true, '']; 
}

Answer 6

 $("#DateOfBirth").datepicker({
        yearRange: "-100:+0",
        changeMonth: true,
        changeYear: true,
    });

yearRange：'1950：2013'，//指定硬编码年份范围或者这样

yearRange：“ - 100：+ 0”，//持续数百年

这将有助于显示年度和月份选择的下拉。

Answer 7

au，nz，ie等是显示国家日期的国家/地区的国家/地区代码（澳大利亚，新西兰，爱尔兰，......）。如代码所示，这些值与'_day'组合并传回以作为CSS样式应用于那一天。相应的样式是下面显示的形式，它将当天的文本移开，并用国家标志的图像替换它。

.au_day {
  text-indent: -9999px;
  background: #eee url(au.gif) no-repeat center;
}

使用新样式传回的“false”值表示可能未选择这些天。

Answer 8

我认为这可能也有效

$(function () {
    $(".DatepickerInputdob").datepicker({
        dateFormat: "d M yy",
        changeMonth: true,
        changeYear: true,
        yearRange: '1900:+0',
        defaultDate: '01 JAN 1900'
    });

显示了jQuery datepicker年

8 个答案: