Lighthouse 错误：“表单元素没有关联的标签”

Question

如何修复此灯塔错误：

表单元素没有关联的标签

<input type="text" id="s" name="s" value="Arama..." onfocus="if (this.value == 'Arama...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Arama...';}">

<select id="main-menu-mob">

<textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required="required"></textarea>

Answer 1

对于其中每一个，您都可以添加引用元素的标签，或使用属性aria-labelledBy。我认为标签是最简单的，但我将向您展示其中的一个。

<label for="s">Arama...</label>
<input type="text" id="s" name="s" value="Arama..." onfocus="if (this.value == 'Arama...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Arama...';}">

<label id="lbl-main-menu-mob">Select Item</label>
<select id="main-menu-mob" aria-labelledby="lbl-main-menu-mob">

<label for="comment">Enter Comment</label>
<textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required="required"></textarea>