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'
});