Input报错“Form elements must have labels: Element has no title attribute Element has no placeholde”

喵~

项目开发难免会遇到些不解的问题，以下总结的是简化版，重在复现问题，解决问题。

写表单时，如果只是单独写了input元素，发现在后台管理会飘红。感觉很奇怪，明明没有写错语法，为什么会飘红呢？

1、写一段最普通的html页面

2、右键，选择 “检查”，打开后台管理器，指向input元素

此时，可以看到飘红的input，鼠标指向input，会显示一段提示：

3、按照提示，Shift + Click，可直接跳至错误的详细说明

Form elements must have labels: Element has no title attribute Element has no placeholder attribute

简而言之就是说：input 元素要有配套的label元素，还要有 title 和 placeholder 属性

也就是说，按照规范来讲，它是建议我们补全对应的配套标签和属性的。

我顺便测试了Chrome浏览器，并没有出现Error提示，只有使用Edge浏览器才会出现。

所以，这个问题，实际上不能算 Error 吧，最多是 Warning ~

既然出现了，就接着测试，如果你的项目就是单纯的需要一个独立的Input，请往下看：

经过测试，三种情况可以消除Error：

4、解决方案

4.1 添加 title 属性

<input type="text" title="Please input">

4.2 添加 placeholder 属性

<input type="text" placeholder="Please input">

以上就是，无需 label 标签，只需给 input 添加 title 或 placeholder 任一属性，即可消除Error。


当然啦，如果想更标准，写全套就更好了：

<label for="target"></label>
<input type="text" id="target" title="input title" placeholder="Please input">