HTML：在输入类型日期中首先显示占位符答案

【问题标题】：HTML: Show placeholder first in input type dateHTML：在输入类型日期中首先显示占位符
【发布时间】：2016-10-12 03:18:51
【问题描述】：

我可以先在输入中显示占位符吗？现在，我点击输入框时可以看到占位符，但我希望它在加载页面时已经可以立即读取占位符。

而不是 mm/dd/yyyy，它应该在页面加载时显示出生日期1

谢谢！

【问题讨论】：

你试过 input type="text" placeholder="test" 吗？？

标签： html css

【解决方案1】：

&lt;input placeholder="Your Date" type="text" onfocus="(this.type='date')" onblur="(this.type='text')" id="date"&gt;

阅读本页

How do I simulate placeholder functionality on input date field?

【讨论】：

谢谢！这就是我一直在寻找的答案！
这很好，但问题是当您离开现场时，dang 日期的格式从 MM/DD/YYYY 更改为 YYYY-MM-DD。一旦控件改回 type='text' ，知道如何让日期保持以前的格式吗？
您无法更改，但请阅读此链接，它会对您有所帮助stackoverflow.com/questions/14647290/…

【解决方案2】：

        var dateofbirth="01/23/1990";
        document.getElementById('test').placeholder=dateofbirth;

codepen-http://codepen.io/nagasai/pen/OXMdvr

【讨论】：

【解决方案3】：

您可以将输入日期默认占位符与:before 元素重叠。输入元素需要用onChange事件控制

/* When Input type="date" && value="" => hide Input content */

input[type="date"][value=""] {
  position: relative;
  height: 100%;
  color: transparent;
  transition: all 0.2s;
}


/* When focus show it*/

input[type="date"]:focus {
  color: inherit;
}


/* Input type="date" && value="" => overlap with before */

input[type="date"][value=""]:before {
  content: attr(placeholder);
  position: absolute;
  height: 100%;
  width: calc(100% - 20px);
  padding-top: 4px;
  color: #aaa;
  background-color: white;
  transition: all 0.2s;
}


/* rid off before on focus */

input[type="date"]:focus:before {
  content: none;
}

&lt;input type="date" placeholder="My placeholder" value="" /&gt;

【讨论】：

【解决方案4】：

http://www.htctu.net/html5/forms/formInputTypes.html#date 试试这个链接。

<input type=date form="sf1" name="date" placeholder="23-7-1988">

【讨论】：