Question

当我使用live声明一个datepicker时，似乎按预期工作，直到你更改月份。然后，如果按下月份和1899年12月，如果按下月份，则不会转到下个月或上个月，而是跳回到1900年1月。

使用

$('.datepicker').live('focus', function () {
  $(this).datepicker('destroy').datepicker();
});

有什么想法吗？

由于

Answer 1

我认为你看到问题的一个可能原因是，当你使用焦点附加到输入时，你就会破坏你的日期选择器并重新制作一个。但是，当您单击输入时，它会运行，因此会破坏日期选择器，并显示一个。但是，当您单击下一个或上一个时，您最初会忽略输入，但是datepicker脚本将“重新聚焦”它，从而触发销毁并重新创建一个日期选择器。

我假设你正在使用直播将日期选择器附加到动态输入 - 你可以在你的ajax调用的success:......回调中使用$('.datepicker').not('.hasDatePicker').datepicker();调用，我将假设，你正在创建你的新的输入。这会将.datepicker()添加到包含datepicker类但未添加.datepicker()的任何输入项目。 （添加了.datepicker()的输入也会添加类hasDatePicker）

另一种方法 - 与现场通话保持一致 - 具有专业和反对意见

PRO ：您只需在代码中使用一次 - 如果您有几个可能添加多个动态输入的ajax调用，则不需要多次放置。
CON ：您正在创建一个更加耗费资源的代码，因为它会在每次输入获得焦点时运行，而不是仅仅应用.datepicker()一次。

因此，为了与现场保持一致，您可以执行以下操作：

$('.datepicker').live('focus', function () {
    $(this).not('.hasDatePicker').datepicker();
});

在行动here

中查看

这会将.datepicker()附加到类datepicker的任何输入，其中尚未已经附加了.datepicker() （类{{ 1}}），这可以节省你破坏和重新创建所有日期选择器。

这与@Andrew Whitaker的解决方案

相同

Answer 2

我能够重现您的示例，并且每次focus处理时我都会登录到控制台，并且每次点击输入时看起来都是两次。我将live处理的事件更改为focusin，问题就消失了：

$('.datepicker').live('focusin', function () {
  $(this).datepicker('destroy').datepicker();
});

我还在挖掘一下，看看到底发生了什么。

编辑：在datepicker的源代码中，有几个手动focus()调用，可能是其中一个导致问题。

另外，由于@ Scoobler的评论如下，上面的修补程序不适用于jQuery 1.5，但似乎适用于1.4.4

此外，如果您的目标是将datepickers应用于通过AJAX添加的元素，您可能需要考虑检查是否存在日期选择器，然后应用datepicker小部件（如果不是已存在：

$('.datepicker').live('focus', function () {
    if (!$(this).data("datepicker")) {
      $(this).datepicker();
    }
});

Answer 3

$('.datepicker').datepicker('destroy');    
$('.datepicker').removeClass("hasDatepicker").removeAttr('id');    
$('.datepicker').datepicker({dateFormat: "yy-mm-dd"});

这将完全删除datepicker，并在每次单击datepicker时创建一个新的。这对下拉列表中的datepicker大多有用。我还发现这对于拥有多行具有自己日期的项目非常有用。

Answer 4

对于jQuery 1.7+，这是动态添加日期输入的一个很好的解决方案

$('.datepicker').on('focusin', function () {
    $(this).not('.hasDatePicker').datepicker();
});

为我工作！

奇怪的jQuery日期选择器操作

4 个答案: