Datepicker 在单个表格视图中显示上个月的日期答案

【问题标题】：Datepicker to show previous month dates in single table viewDatepicker 在单个表格视图中显示上个月的日期
【发布时间】：2014-08-01 00:42:18
【问题描述】：

我试图在具有单个表视图的日期选择器中显示从当天开始的最后 35 天。其余日期不可见。例如，对于 2014 年 7 月 25 日，日期选择器应该是这样的。

 SUN MON TUE WED THU FRI SAT

                          21
  22  23  24  25  26  27  28
  29  30   1   2   3   4   5
   6   7   8   9  10  11  12
  13  14  15  16  17  18  19
  20  21  22  23  24  25

~~写过Java代码here。~~

我尝试将 jquery-ui.js 中的 numRows 增加到 6，但它只添加日期为下个月而不是上个月的行，如下所示：

JSFiddle

请帮忙。谢谢！

【问题讨论】：

标签： javascript jquery jquery-ui datepicker

【解决方案1】：

试试defaultDate 选项：

DEMO

$(function () {
    var $datePicker = $("#datepicker");
    $datePicker.datepicker({
        defaultDate: "-34d",
        minDate: "-34",
        maxDate: "0",
        showOtherMonths: true,
        selectOtherMonths: true,
        onSelect: function (date) {
            alert(date + " selected");
        }
    });
    alert($datePicker.datepicker("getDate"));
});

呈现：

【讨论】：

【解决方案2】：

终于明白了。感谢 Palpatim 提出 defaultDate 的想法。

日期选择器功能：

$(function() {    
   $( "#datepicker" ).datepicker({
    minDate:"-34",
    defaultDate: "-34d",
    maxDate:"0",
    showOtherMonths: true,
    selectOtherMonths: true,
    onSelect: function(date) {
           alert(date);
        }
   });  
});

在 jquery-ui.js 中做了两处改动

将“numRows”增加到 12。
注释 updateDatePicker 以防止任何重置日期选择器。

numRows = 12;

//this._updateDatepicker(inst);

然后删除不需要的行如下：

    function doTheMagic(){
        $tr=$(".ui-datepicker-calendar tbody tr");
        for(i=0;i<$tr.length;i++){

              $f=0;
              $($tr[i]).find("td").each(function(f){
              if($(this).attr("class").indexOf("disabled")<0)
                {
                  $f=1;
                  return false;
                }
                });

              if($f==0)
                $($tr[i]).remove();


        }

        $("td[class=' ui-datepicker-unselectable ui-state-disabled '], td[class=' ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled '], td[class=' ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled '], td[class=' ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled ']").each(
              function(){$(this).empty();}
            );
    }

正是我想要的：

这是JSFiddle

【讨论】：