jQuery datepicker - 覆盖选项 beforeShow答案

【问题标题】：jQuery datepicker - override options beforeShowjQuery datepicker - 覆盖选项 beforeShow
【发布时间】：2011-06-14 01:33:39
【问题描述】：

我提出了这个话题here，但不知道如何回复它并且仍然得到我的新问题的答案......所以我只是提出了这个话题。

好的，所以我让我的日期选择器在 beforeShow 的上方/下方添加一个类，但现在我需要它来更改它在 beforeShow 上的一个选项（以便它动画为 slideUp 或 slideDown 取决于它是在上方还是下方打开)。

inst.settings.showAnim = 'slideUp'; 在 DP_jQuery_1308014346347.datepicker._curInst.settings.showAnim 下的 firebug 上的 DOM 选项卡中设置选项，但它不会显示日期选择器。

实际上，我只是注意到设置 showAnim: 'slideUp' 甚至无法自行工作，这是否意味着日期选择器不会接受它 o_O？好像有点奇怪……

谁能帮忙:)？

【问题讨论】：

您到底想完成什么？更改显示时的日历动画？
是的，很抱歉。当它显示时，如果它显示在上面，我希望它向上滑动。如果它在下面显示，我希望它向下滑动。我有它，因此它实际上更改了 DOM 中 _curInst 的设置值，但它不运行动画并且它保持隐藏...

标签： jquery jquery-ui datepicker jquery-ui-datepicker

【解决方案1】：

您究竟想在哪里设置动画选项？

如果您使用您编写的动画选项初始化日期选择器：

$("#myDatePicker").datepicker({ 
    showAnim: 'slideUp' 
});

如果日期选择器已经被初始化，那么你必须使用第二种方法：

$("#myDatePicker").datepicker("option", "showAnim", "slideUp");

【讨论】：

我在 beforeShow 函数中执行此操作，因为我希望它检测它是要向上还是向下，并相应地更改动画。我在设置中将选项 showAnim: 'slideDown' 作为默认设置（在您的第一个示例中），但是如果它高于输入，我希望它更改为 slideUp。
所以，正如我所说，如果您正在初始化 datepicker，请使用选项 1。如果它已经初始化，请使用选项 2。由于您尝试在 beforeShow 函数中执行此操作，这意味着日期选择器已经初始化。因此，选项 2。
我放 $("#myDatePicker").datepicker("option", "showAnim", "slideUp");那么在我的 beforeShow 代码中呢？？
没错，这样做。实验。
好的，这和我提到的一样有效。它仍然有同样的问题（我没有提到），第一次打开日期选择器可以将选项设置为 slideDown（当它在下面时），然后设置为 fadeIn（当它在上面时），然后当你去尝试并在下面再次打开它，它不再起作用了。它只是完全停止打开。

【解决方案2】：

解决方案：

不要更改实例中的设置，更改它不再调用插件。

 beforeShow: function(input, inst) {
if (inst.dpDiv.position().top > $(input).position().top) {
        $(inst.dpDiv).removeClass('ui-datepicker-above').addClass('ui-datepicker-below');
        $(input).removeClass('above').addClass('below');
        $('#order-main .datepicker').datepicker('option','showAnim','slideDown');
       } else {
        $(input).removeClass('below').addClass('above');
        $(inst.dpDiv).removeClass('ui-datepicker-below').addClass('ui-datepicker-above');
        $('#order-main .datepicker').datepicker('option','showAnim','fadeIn');
      }

【讨论】：