Question

我有一个带有changeyear的日期选择器：true。 “年度”下降显示标题为2009年，而不是明年低于标题，即2008年，2007年，2006年等等，它从1999年开始并向上计数。我似乎无法找到一个简单的解决方案来扭转这个顺序？

Answer 1

我不建议将原始ui.datepicker.js编辑为Cuong建议，因为一旦您或其他开发人员在发布新版本时替换该文件，您的更改将会丢失。记住为重新申请而进行的自定义是不切实际的。相反，您可以覆盖现有的_generateMonthYearHeader方法，如下所示：

// store original so we can call it inside our overriding method
$.datepicker._generateMonthYearHeader_original = $.datepicker._generateMonthYearHeader;

$.datepicker._generateMonthYearHeader = function(inst, dm, dy, mnd, mxd, s, mn, mns) {
  var header = $($.datepicker._generateMonthYearHeader_original(inst, dm, dy, mnd, mxd, s, mn, mns)),
      years = header.find('.ui-datepicker-year');

  // reverse the years
  years.html(Array.prototype.reverse.apply(years.children()));

  // return our new html
  return $('<div />').append(header).html();
}

我刚刚为我正在研究的东西写了这篇文章并且很好地解决了这个问题：）

Answer 2

我认为在不翻录插件的情况下破解插件的最佳方法是为年份选择项分配一个事件处理程序。

//Hack for reverting year order
$(document.body).delegate('select.ui-datepicker-year', 'mousedown', function() {
  (function(sel) {
    var el = $(sel);
    var ops = $(el).children().get();
    if ( ops.length > 0 && $(ops).first().val() < $(ops).last().val() ) {
      $(el).empty();
      $(el).html(ops.reverse());
    }
  })(this);
});

此代码必须正常工作！：P

Answer 3

打开文件ui.datepicker.js
找到方法_generateMonthYearHeader: function(inst, drawMonth, drawYear, minDate, maxDate, selectedDate, secondary, monthNames, monthNamesShort)

在方法

中找到以下循环

for (; year <= endYear; year++) {
    html += '<option value="' + year + '"' +
        (year == drawYear ? ' selected="selected"' : '') +
        '>' + year + '</option>';
}

html += '</select>';

在该循环之前插入以下代码：

if (year-100 < 1900) // Check year is lower then 1900
    year = 1950;     // change start point of above loop, it helps you having the 
                     // year's dropdownlist starting at 1950, and ending of current year plus 10.

Answer 4

我有一个答案，但这并不是你想听到的。

在互联网上寻找可以逆转下拉年份顺序的解决方案之后，我来到了这个：

{
    changeMonth: true
    , changeYear: true
    , yearRange: '-65:'
    , maxDate: '1999/12/31'
}

这将预先选择maxdate，因此选择一年您将自动看到最后一个条目，从而能够滚动向上选择更早的日期。

编辑：任意添加yearRange，以创建65年前的起点。 maxDate也是任意选择的，作为撰写此评论前12年的日期。基本上，此菜单允许某人选择12至65岁的年龄。

这不太理想，但效果还不错。

Answer 5

有一种＆＃34;方式＆＃34;让这一年从最后一个日期开始：

dateFormat: 'mm/dd/yy',
changeMonth: true, 
changeYear: true,  
yearRange: "-70:", 
maxDate: "-13Y"

相反，如果将yearRange用作固定年份yearRange: "1900:-13"，最好自下而上使用此"-70:"，并设置maxDate。现在我从2004年开始，而不是从1900年开始我的年份选择框。

P.S：所有其他解决方案都经过测试。它们非常慢，有些不能很好地工作（尤其是旧的 - 例如当前年份而不是2004年）。

Answer 6

将for循环的第一行替换为：

var minYear = year;
year = endYear;
for (; year >= minYear; year--) {

JQuery UI Datepicker，在下拉列表中反转年份的顺序

6 个答案: