没有日期选择器的html日期输入 [英] html date input without the date picker

问题描述

我输入的日期很简单

<input type="date" id="sign-up-dob" class="sign-inputs" max="2999-12-31"></input>

它看起来像这样:

我该如何清除打开日期选择器的箭头和右边的内容.我只想要它，所以您可以输入带有验证的日期，谢谢.

How would i get rid of the arrows and stuff to the right that open the date picker. I just want it so you can type the date with validation, thanks.

推荐答案

只需在文本输入中使用pattern属性:

Just use the pattern attribute on a text input:

input:invalid {
    color: red;
}

[type="date"]::-webkit-inner-spin-button {
  display: none;
}
[type="date"]::-webkit-calendar-picker-indicator {
  display: none;
}

<label>Input Date (YYYY-MM-DD):
<input type="text" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" />
</label>

<input type="date" />

这篇关于没有日期选择器的html日期输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！