Javascript 有没有办法在输入日期触发日历？

我已经习惯于将jQuery datepicker放入我的代码中，但我找到了下面图像的本机输入（input type=“date”），并决定给它一个机会。我试图触发日历在双击事件中显示，就像用户单击右侧的箭头一样，但没有成功，因为我无法识别浏览器是如何实现它的（Chrome 56.0.2924.87）

如果可能的话，任何人都有想法，我该怎么做

提前谢谢

---

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

唯一的负面影响是你看不到图标

其思想是将日期输入设置为相对，然后绝对定位datepicker图标以覆盖整个输入，并将其不透明度设置为0，使其不可见

这会在您单击输入时触发跨浏览器的日期选择器

代码：

---

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

唯一的负面影响是你看不到图标

其思想是将日期输入设置为相对，然后绝对定位datepicker图标以覆盖整个输入，并将其不透明度设置为0，使其不可见

这会在您单击输入时触发跨浏览器的日期选择器

代码：

---

您是否尝试了Jquery的prevent.default？在chrome中，您可以使用

input:：-webkit日历选取器指示符

访问，我不知道您是否可以触发对该元素的单击

$（'input:：-webkit日历选取器指示符'）。单击（）

以防万一看看这个问题我尝试了$（'input:-webkit日历选取器指示符'））.click（）和$（'#elementid:：-webkit日历选取器指示器'）。click（）但不起作用。在这种情况下，我应该如何使用prevent.default？我不知道在何处使用它以及如何显示日历。您是否尝试过Jquery的prevent.default？在chrome中，您可以使用

input:：-webkit日历选择器指示符

，我不知道您是否可以触发该元素的单击

$（'input:：-webkit日历选择器指示符'）。单击（）

以防万一看看这个问题，我试过$（'input:：-webkit calendar picker indicator'）。单击（）和$（'#elementid:：-webkit calendar picker indicator'）。单击（）但不起作用。在这种情况下，我应该如何使用prevent.default？我不知道在哪里使用它，日历是如何显示的。我不遵循第一部分。你到底指的是什么有用的答案？你的答案是我能看到的这个问题的唯一答案。@cigien谢谢。。。实际上经历了很多stackoverflow线程。。。我对答案进行了编辑，以避免含糊不清。我不遵循第一部分。你到底指的是什么有用的答案？你的答案是我能看到的这个问题的唯一答案。@cigien谢谢。。。实际上经历了很多stackoverflow线程。。。我编辑了答案以避免歧义

/* 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;
}