Question

我正在使用html5 datetimepicker，并且希望在您单击输入字段上的任何位置时显示日期弹出窗口，而不是强制单击小箭头。我怎么能这样做？

这里的问题表明可以做到这一点。通过问题上的链接运行代码或在答案上运行代码段。单击输入字段将打开弹出窗口。 how to style html5 date input, first element focus/active

＆＃13;

::-webkit-inner-spin-button {
  display: none;
}
 ::-webkit-datetime-edit-text {
  background: none;
}
 ::-webkit-datetime-edit-month-field {
  background: none;
}
 ::-webkit-datetime-edit-day-field {
  background: none;
}
 ::-webkit-datetime-edit-year-field {
  background: none;
}
 ::-webkit-datetime-edit-text:focus {
  background: rgba(255, 255, 255, 0.5);
}
 ::-webkit-datetime-edit-month-field:focus {
  background: rgba(255, 255, 255, 0.5);
}
 ::-webkit-datetime-edit-day-field:focus {
  background: rgba(255, 255, 255, 0.5);
}
 ::-webkit-datetime-edit-year-field:focus {
  background: rgba(255, 255, 255, 0.5);
}
 ::-webkit-clear-button {
  display: none;
  -webkit-appearance: none;
}
 ::-webkit-calendar-picker-indicator {
  background: none;
}

＆＃13;

<input [(ngModel)]="data.value.date_of_visit" id="selectedDate" type="date" name="date_of_visit" class="form-control date-filter pseudo-input live-update" placeholder="Event Date" value="2013-01-08" formControlName="date_of_visit" aria-describedby="inputSuccess2Status"
style="line-height: 20px;">

＆＃13;

非常感谢任何帮助！

Answer 1

在onfocus上触发F4键盘事件

function showCal(element) {
   var event = document.createEvent('KeyboardEvent');
   event.initKeyboardEvent('keydown', true, true, document.defaultView, 'F4', 0);
   element.dispatchEvent(event);
}

使用onfocus事件绑定此功能

如何在不必点击选择指标的情况下显示HTML5 datetimepicker？

1 个答案: