什么是“for”属性在HTML中做< label>标签？ [英] What does "for" attribute do in HTML <label> tag?

问题描述

 < label>在此处输入：< /标签> 
< input type ='text'name ='theinput'id ='theinput'/> 
  

和

 < label for ='theinput'>在此输入：< / label> 
< input type ='text'name ='theinput'id ='theinput'/> 
  

我确定它在使用特殊的JavaScript库时会做某些事情，但除此之外，它验证了HTML还是需要其他原因？

标签允许你点击标签，并且它将被视为像点击相关的输入元素一样。有两种方法可以创建这种关联：

首先，您可以将标签元素包装在输入元素周围：

 < label>在此处输入：
< input type ='text'name ='theinput'id ='theinput'> 
< / label> 
  

另一种方法是将用于属性，给它关联输入的ID：

 < label for =theinput>在此处输入：< /标签> 
< input type ='text'name ='whatever'id ='theinput'> 
  

这对于使用复选框和按钮特别有用，因为这意味着您可以通过单击在相关的文本上，而不必点击框本身。

阅读 MDN 。

I wonder what is the difference between the following two code snippets:

<label>Input here : </label>
<input type='text' name='theinput' id='theinput'/>

and

<label for='theinput'>Input here : </label>
<input type='text' name='theinput' id='theinput'/>

I'm sure it does something when you use a special JavaScript library, but apart from that, does it validate the HTML or required for some other reason?

解决方案

The <label> tag allows you to click on the label, and it will be treated like clicking on the associated input element. There are two ways to create this association:

First, you can wrap the label element around the input element:

<label>Input here:
    <input type='text' name='theinput' id='theinput'>
</label>

The other way is to use the for attribute, giving it the ID of the associated input:

<label for="theinput">Input here:</label>
<input type='text' name='whatever' id='theinput'>

This is especially useful for use with checkboxes and buttons, since it means you can check the box by clicking on the associated text instead of having to hit the box itself.

Read more about this element in MDN.

这篇关于什么是“for”属性在HTML中做< label>标签？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！