明确强制显示 jquery 日期选择器日历

Question

我有一个链接到 JQuery 日期选择器的文本框，其中 Chrome 没有帮助 pre-populating 用户名。我在该字段中有 autocomplete="off"，但是根据

这没有效果

Chrome ignores autocomplete="off"

显然 Chrome 的行为对开发人员来说是一个 long-running 问题，我不清楚目前的情况。其中一个解决方案的标题是 "Modern approach"，但那是四年前的事了。但是，我喜欢它解决问题的方式

<input type="text" onfocus="this.removeAttribute('readonly');" readonly />

因为它不需要多余的字段，而且它看起来可以承受 Chrome 的设计者为确保表单创建者无法控制自己的表单而采取的下一步行动。（我参考了Disabling Chrome Autofill中mindplay.dk的评论）

然而，尽管此解决方法成功地阻止了自动完成，但它会在用户单击该字段时杀死日期选择器日历的 pop-up，这大概是因为我定义了一个显式的 onfocus 事件。我想我只需要将显示日历显式添加到 onfocus 代码中——如果我知道怎么做的话？我猜是这样的..

onfocus="this.removeAttribute('readonly'); this.JQuery.showPicker();"

也很高兴接受这样的回答"there's now a better, future-proofed way of doing this.."

Answer 1

根据官方文档，您应该使用 datepicker('show') method to achieve your goal. I've prepared sample fiddle。

const selector = '#datepicker';
$(selector).datepicker(); // init datepicker

$(selector).on('focus', function() {
  $(this).datepicker("show");
});

explicitly force display of jquery datepicker calendar