jquery datepicker - beforeShowDay 问题

Question

我有以下代码:

$(document).ready(function(){

   $(".datepicker").each(function() {

     $(this).datepicker({
    beforeShowDay: function(date){ return [$(this).parent().find("span.days").html(), ""] },

     });
   });

  });

有了这个正文代码...

<div>
<span class="days">(date.getDay() == 1 || date.getDay() == 4)</span>
<input type="text" class="datepicker">
</div>


<div>
<span class="days">(date.getDay() == 2 || date.getDay() == 5)</span>
<input type="text" class="datepicker">
</div>

我想要做的是让每个日期选择器都可以选择不同的日期。

我尝试执行此操作的方式(将 beforeShowDay 代码的不同部分放在一个跨度中)可能不是最优雅的，因此请随意分解我的代码并在必要时进行更改。

Answer 1

您可以创建一个保留可挑选日期的对象，如下所示:

var pickable = { dp1: [1, 4], dp2: [2, 5] };
$('.datepicker').each(function() {
  $(this).datepicker({
    beforeShowDay: function(date){ 
        var day = date.getDay(), days = pickable[this.id];
        return [$.inArray(day, days) > -1, ""];
    }
  });
});​

You can give it a try here 。 dp1 和 dp2 是控件的 ID...或者您可以真正映射的任何属性，如下所示:

<input type="text" class="datepicker" id="dp1">
<input type="text" class="datepicker" id="dp2">

这个概念非常简单，获取 ID 来获取此选择器的天数数组，然后使用 $.inArray()查看我们所在的日期是否在该数组中。如果这些日期的选择可以共享，请不要使用 ID，而是对属性执行类似 data-pickerType 的操作，并将 this.id 替换为 $上面代码中的 (this).attr("data-pickerType") 。

注意:我留下了 .each()完好无损，因为我知道您出于当前问题之外的原因需要它。