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">

要全部省略 和 id 属性，请将输入放在标签

中

<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。

由于您希望用户向此字段添加输入，因此您应该确保它们彼此链接。