label元素的for属性必须引用非隐藏表单控件

Question

我的代码中有一些错误这是我的错误：

label元素的for属性必须引用非隐藏表单控件。

和myd代码：

 <form action="/search"> <span class="input input--hoshi search-wrapp main-page-open" style="display:block"> <input class="input__field input__field--hoshi" type="text" id="search" name="keyword" placeholder="Search..."/> <label class="input__label input__label--hoshi input__label--hoshi-color-2" for="input-5"> <!--<span class="input__label-content input__label-content-hoshi">Search...</span>--> </label> <span class="icon-serch"></span> </span> <input id="search-btn" type="submit" style="display: none;"/> </form> 

怎么了 谢谢！

Answer 1

属性的标签必须包含输入ID值

<label for="foo">Foo:</label>
<input id="foo">

要完全省略for和id属性，请将输入内容放在label内

<label>
    Foo: <input name="foo">
</label>

还要注意， 输入不能隐藏 <input type="hidden"> ，但是可以将其设置为隐藏的<input style="display:none">

Answer 2

验证程序期望标签的for字段以包含它的输入元素的id字段为目标。 在这里，这意味着for="input-5"应该是for="search" ，因为<input>的id是search 。

期望用户将输入添加到该字段时，应确保他们彼此链接。