javascript - 在html页面中自定义输入日期

Question

我的 html 页面中有一个日期字段:

<input type="date"   id="birth_date" name="birth_date" placeholder="dd/mm/yyyy"   /> 

当我启动我的应用程序时，我得到了这个结果:

我需要知道如何使用最简单的方式隐藏这些控件(图像右侧)？

谢谢，

Answer 1

如果我没理解错的话，对于 webkit 浏览器上的 input[type=date]，您需要删除 4 个内容:

1. 蓝十字
2. 向上箭头按钮
3. 向下箭头按钮
4. 日期选择器下拉按钮(打开日期选择器)

这条 CSS 规则将把它们全部隐藏起来:

input[type=date]::-webkit-clear-button, /* blue cross */
input[type=date]::-webkit-inner-spin-button, /* up */
input[type=date]::-webkit-outer-spin-button, /* down */
input[type=date]::-webkit-calendar-picker-indicator /* datepicker*/ {
    display: none;
}