javascript - 更改选项卡或最小化浏览器后日历再次出现

Question

我正在使用 pickadate jquery 插件并将其应用于表单页面中的字段。

当用户单击输入字段时，我正在处理 2 个可能的选项:

1. 日历出现，用户选择一个日期(之后日历自动关闭)
2. 用户只是关闭日历(不选择任何日期)

发生的情况是，在执行上述两个选项之一之后，如果用户在浏览器中打开另一个选项卡(然后返回到表单选项卡)或最小化浏览器(然后在表单选项卡中再次打开)，日历再次出现。

只有当最后选择的字段是应用了 pickadate 插件的字段时才会发生这种情况。如果用户选择另一个不包含 pickadate 插件的字段并执行相同的过程(更改选项卡或最小化浏览器)，则日历不会再次出现。

如果最后选择的字段是应用了 pickadate 插件的字段，我应该怎么做才能不显示日历？

调用插件的代码是:

$(document).ready(function() {
    $('.datepicker').pickadate();
});

Answer 1

方法一(这个方法对我有用)

将onOpen添加到初始化对象。

var $input = $('.datepicker');
$input.pickadate({
    onOpen: function () {
        if ($input.hasClass('picker__input--target')) {
            $input.pickadate().pickadate('picker').close(true);
        }
    }
});

方法二(这个方法对我没用，可能是我没写对)

将onClose添加到初始化对象。

var $input = $('.datepicker');
$input.pickadate({
    onClose: function() {
            $input.blur();
        }
    }
});

Source from github