jquery日期选择器中的疯狂行为

Question

我在我的RoR应用程序中有来自jquery1.8.1.min.js的jquery日期选择器的2个不同实例。

我有这个功能：

    $(".date-picker:not('#policy_starts_on')").datepicker();
    $('#policy_starts_on.date-picker').datepicker({
        startDate: '0',
        endDate: '+90d'
    });

这与输入有关：

<input class="required  date-picker input-small align-center" id="policy_starts_on" name="policy[starts_on]" size="30" type="text" value="02/27/2013">

然后我有这个功能：

    $(".date-picker:not('#act_event_ends_on')").datepicker();
    $('#act_event_ends_on.date-picker').datepicker({
        startDate: '0',
        endDate: '+180d'
    });

这与输入有关：

<input class="required date-picker input-small align-center" id="act_event_ends_on" name="act_event[ends_on]" size="30" type="text">

这两个输入都是由ruby表单助手生成的：

这是第一个表单助手：

= f.input :starts_on, :label => 'Policy Start Date', :required => true

这是第二个表单助手：

= f.input :ends_on, :label => 'Event End Date', :required => true 

问题：为什么第一个输入被正确限制（过去一天你不能选择IE，而且只允许你将来90天），而第二个输入没有受到限制？

---

Answer 1

这一行：

$(".date-picker:not('#policy_starts_on')").datepicker();

初始化第二个输入（id =“act_event_ends_on”），因为它具有date-picker类，并且没有policy_starts_on id。

因此，此元素已初始化，以下代码将不再为您执行任何操作：

$('#act_event_ends_on.date-picker').datepicker({
    startDate: '0',
    endDate: '+180d'
});

解：

我的建议是给出例外特殊的类名（即“date-picker-special”）：

<input class="required  date-picker date-picker-special input-small align-center" id="policy_starts_on" name="policy[starts_on]" size="30" type="text" value="02/27/2013">

<input class="required date-picker date-picker-special input-small align-center" id="act_event_ends_on" name="act_event[ends_on]" size="30" type="text">

然后，您可以执行以下操作：

$(".date-picker:not('.date-picker-special')").datepicker();
$('#policy_starts_on.date-picker').datepicker({
    startDate: '0',
    endDate: '+90d'
});
$('#act_event_ends_on.date-picker').datepicker({
    startDate: '0',
    endDate: '+180d'
});

Answer 2

仅仅为了实验，如果你以相反的顺序声明那些日期选择器设置，会发生相反的行为吗？ 如果相反的一个中断，那么你可以得出结论，datepicker有一个bug（这是不可能的）。 否则，你需要查看自己的代码。

另外，请注意您在每个块之前都有这样的事情：

$(".date-picker:not('#policy_starts_on')").datepicker();

这就是说选择所有日期选择器除了一个特定日期选择器。

所以下次你设置一个，它已经被说出来了。 尝试删除那些单行，你留下：

$('#policy_starts_on.date-picker').datepicker({
    startDate: '0',
    endDate: '+90d'
});

$('#act_event_ends_on.date-picker').datepicker({
    startDate: '0',
    endDate: '+180d'
});