HTML 时间输入类型 - 如何在单击任意位置而不仅仅是单击时钟图标时选择时间菜单视图

Question

我正在研究HTML 中的时间输入类型，我的问题是，当我单击输入右侧的 小时钟图标时，会查看可选择的时间菜单，但当我单击输入上的任意位置时，我需要显示它。

我发现了这个问题，但这并不能解决我的问题，因为它与 Timepacker 有关，而不仅仅是 HTML。

单击整个输入类型时间 HTML5 字段不仅在小时钟图标上显示时间选择器

HTML：

  <label for="first" class="">{{__('From Hour')}}</label>
   <input type="time" class="form-control input-md"name="" id="from_hour" value="">

Answer 1

对我来说，onfocus="this.showPicker()"在时间输入上添加属性解决了问题。

来源： /sf/answers/5083916771/

Answer 2

感谢@StepPen-codes，如何在输入中单击任意位置时打开 HTML 日期选择器对话框？

您可以使用 CSS 来实现这一目的。它有效，但就我而言，日历图标消失了。我试图把它带回来，但位置不太好。

input#session-date::-webkit-calendar-picker-indicator{
  display:block;
  top:0;
  left:0;
  background: #0000;
  position:absolute;
  transform: scale(12)
}