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()因为我知道你需要它是因为当前问题之外的原因。

jquery datepicker - beforeShowDay问题

1 个答案: