使用Datepicker组件时，默认情况下年份下拉列表仅显示10年。用户必须单击最后一年才能添加更多年份。
我们如何设置初始范围为100年，以便用户默认情况下看到一个大的年份列表？
function InitDatePickers() {
$(".datepicker").datepicker({
changeMonth: true,
changeYear: true,
showButtonPanel: true,
maxDate: '@maxDate',
minDate: '@minDate'
});
}
您可以使用此选项设置年份范围，根据此文档http://api.jqueryui.com/datepicker/#option-yearRange
yearRange: '1950:2013', // specifying a hard coded year range
或者这样
yearRange: "-100:+0", // last hundred years
从文档中
默认值：“c-10:c+10”
年份下拉菜单中显示的年份范围：相对于今天的年份（“-nn：+nn”），相对于当前选择的年份（“c-nn：c+nn”），绝对值（“nnnn：nnnn”）或这些格式的组合（“nnnn：-nn”）。请注意，此选项仅影响下拉菜单中显示的内容。要限制可以选择的日期，请使用minDate和/或maxDate选项。
+号。 - th1rdey3c-100:c+10。 - DreamTeKc 实际上表示“当前选择的年份”，而不是当前年份。参考链接：http://api.jqueryui.com/datepicker/#option-yearRange。 - wirey00尝试以下操作：
ChangeYear：当设置为true时，表示可以选择当前月份日历中指示的前一个或后一个月份的单元格。此选项与options.showOtherMonths设置一起使用。
YearRange：指定年份下拉列表中的年份范围。（默认值：“-10：+10”）
示例：
$(document).ready(function() {
$("#date").datepicker({
changeYear:true,
yearRange: "2005:2015"
});
});
var dateToday = new Date();
var yrRange = dateToday.getFullYear() + ":" + (dateToday.getFullYear() + 50);
and then
yearRange : yrRange
50是与当前年份的范围。
yearRange: "c-100:c+0", // last hundred years and current years
yearRange: "c-100:c+100", // last hundred years and future hundred years
yearRange: "c-10:c+10", // last ten years and future ten years
yearRange时遇到了问题，因为它似乎无法与我的版本（1.5）一起使用。我更新了最新的jquery-ui datepicker版本，链接如下：https://github.com/uxsolutions/bootstrap-datepicker。是我要找的选项，而我在搜索网络时没有找到任何结果。defaultViewDate
$('#birthdate').datepicker({
startView: 2,
maxViewMode: 2,
daysOfWeekHighlighted: "1,2",
defaultViewDate: { year: new Date().getFullYear()-20, month: 01, day: 01 }
});
虽然原问题发布已经很久了，现在提出可能有点晚，但这是我所做的事情。
我需要一个70年的范围，虽然不像100年那么多，但对于访问者来说仍然是太多年需要滚动查看。(jQuery可以按组步进年份，但对大多数人来说这很麻烦。)
第一步是修改datepicker小部件的JavaScript代码：
在jquery-ui.js或jquery-ui-min.js中找到以下代码(它将被最小化):
for (a.yearshtml+='<select class="ui-datepicker-year" onchange="DP_jQuery_'+y+".datepicker._selectMonthYear('#"+
a.id+"', this, 'Y');\" onclick=\"DP_jQuery_"+y+".datepicker._clickMonthYear('#"+a.id+"');\">";b<=g;b++)
a.yearshtml+='<option value="'+b+'"'+(b==c?' selected="selected"':"")+">"+b+"</option>";
a.yearshtml+="</select>";
a.yearshtml+='<select class="ui-datepicker-year" onchange="DP_jQuery_'+y+
".datepicker._selectMonthYear('#"+a.id+"', this, 'Y');
\" onclick=\"DP_jQuery_"+y+".datepicker._clickMonthYear('#"+a.id+"');
\">";
for(opg=-1;b<=g;b++) {
a.yearshtml+=((b%10)==0 || opg==-1 ?
(opg==1 ? (opg=0, '</optgroup>') : '')+
(b<(g-10) ? (opg=1, '<optgroup label="'+b+' >">') : '') : '')+
'<option value="'+b+'"'+(b==c?' selected="selected"':"")+">"+b+"</option>";
}
a.yearshtml+="</select>";
.ui-datepicker OPTGROUP { font-weight:normal; }
.ui-datepicker OPTGROUP OPTION { display:none; text-align:right; }
.ui-datepicker OPTGROUP:hover OPTION { display:block; }