在输入框内打开 HTML5 日期选择器点击答案

【问题标题】：Open HTML5 date picker inside input box click在输入框内打开 HTML5 日期选择器点击
【发布时间】：2020-10-26 04:59:22
【问题描述】：

我正在尝试使用以下代码在输入文本框中单击时打开 HTML5 日期选择器，但它没有按预期工作。

但是，单击日历图标会打开日期选择器（默认情况下）。这是在我的 Angular 7 应用程序中。

HTML：

<input
  type="date"
  name="startDate"
  id="datePick"
  (click)="openDP()"
  class="input--small"
/>

打字稿：

declare var $;

openDP() {           
  $('#datePick').datepicker('show');
}

我的代码有什么问题吗？

【问题讨论】：

【解决方案1】：

尝试输入 type="text" 而不是 type="date" 和焦点事件调用函数“openDP”。

<input name="date" type="text" (focus)="focusFunction()" (focusout)="focusOutFunction()">

注意：您也可以使用 angularjs-datepicker 代替默认的 HTML5 日期选择器，因为 Safari 或 Internet Explorer 11（或更早版本）不支持 type="date"。

【讨论】：