有没有办法在双击时触发日期输入的日历？

Question

我试图触发<input type="date">日历在双击事件上显示，就像用户单击右侧的箭头一样，但没有成功，因为我无法识别浏览器如何实现它。（Chrome 56.0.2924.87）。

任何人都知道是否可能，如果可以的话我该怎么做？

<input type="date">

Answer 1

我找到了一种跨浏览器工作的更好方法。

唯一的缺点是您看不到该图标。

这个想法是将日期输入设置为相对日期，然后绝对定位日期选择器图标以跨越整个输入，并将其不透明度设置为 0，使其不可见。

当您单击输入时，这会跨浏览器触发日期选择器。

代码：

/* date styles */
.datepicker {
  position: relative;
  cursor: pointer;
  box-sizing: border-box;
  line-height: normal !important;
}
.datepicker::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
}