Javascript 如何使Pikaday日期选择器始终可见

我在用电话

默认功能是将其附加到输入，单击该输入将加载日期选择器，其位置将相对于输入

我想要的是使用此库显示始终可见的日历。我尝试了几件没有成功的事情，比如把它连接到一个div上。我希望它能够一直显示出来，并且能够控制它的位置

---

有什么想法吗？

如果这对其他人有帮助：

由于Pikaday库并非真的要以这种方式使用，因此我必须实现一种变通方法。好的方面是，它不需要修改Pikaday代码本身，因此与将来的版本完全兼容（假设它们不重命名“hide”函数）

首先，我只需将日期选择器附加到一个空div，并使用css将其四处移动，直到它位于正确的位置：

var datePicker = new Pikaday({
   field: $('#empty-div')[0]
});

然后，我只需代理Pikaday隐藏函数并将其临时设置为noop：

var hideFun = datePicker.hide;
datePicker.hide = function() {/*noop*/}

现在，我可以显示日期选择器，而不用担心它会消失（因为它会在内部调用新的noop hide函数）：

最后，当我准备恢复datepicker的原始操作时，我将函数重置为原始函数，并隐藏datepicker（因为我在模式中显示它）：

---

起初，我还实现了一个黑客解决方案，但后来我找到了一种常规方法，使Pikaday datepicker始终可见：

var picker = new Pikaday(
{
    field: document.getElementById('datepicker'),
    bound: false,
    container: document.getElementById('container'),
});

---

举个例子：

如果可能的话，我更愿意选择pickaday。我一直反对使用jqueryui组件，我提出了一个解决方案，将日历附加到一个div，然后定位div，使日历出现在正确的位置。然后，关键是代理日历的hide（）函数，以便它本质上是一个noop，直到我希望它关闭时才恢复其原始功能。这个现在很好用。我仍然会保留这个问题，以防有更好的解决方案。

datePicker.hide = hideFun;
datePicker.hide();

var picker = new Pikaday(
{
    field: document.getElementById('datepicker'),
    bound: false,
    container: document.getElementById('container'),
});