4

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

我有这个功能：

    $(".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天）而第二个输入根本没有被限制？

4

2 回答 2

2

这一行：

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

初始化第二个输入（带有 id="act_event_ends_on" 的那个），因为它有date-picker类但没有policy_starts_onid。

结果，这个元素已经被初始化了，下面的代码将不再为你做任何事情：

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

解决方案：

我的建议是为异常提供特殊的类名（即“日期选择器特殊”）：

<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'
});
于 2013-02-27T17:17:06.517 回答
1

只是为了实验，如果您以相反的顺序声明这些日期选择器设置，是否会发生相反的行为？如果另一个坏了，那么你可以断定 datepicker 有一个错误（这不太可能）。否则，您需要查看自己的代码。

另外，请注意，您在每个块之前都添加了如下内容：

$(".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'
});
于 2013-02-27T17:16:27.363 回答