我在 jQuery 中看到过这个 - 它有什么作用？
<label for="name"> text </label>
<input type="text" name="name" value=""/>
问问题
109869 次
11 回答
157
该for属性用于标签。它指的是与此标签关联的元素的 id。
例如：
<label for="username">Username</label>
<input type="text" id="username" name="username" />
现在，当用户在文本上单击鼠标时，username浏览器将自动将焦点放在相应的input字段中。这也适用于其他输入元素，例如<textbox>和<select>。
引用规范：
此属性明确地将正在定义的标签与另一个控件相关联。如果存在，此属性的值必须与同一文档中某个其他控件的 id 属性的值相同。如果不存在，则定义的标签与元素的内容相关联。
至于为什么您的问题被标记为 jQuery 以及您在哪里看到它在 jQuery 中被使用，我无法回答，因为您没有提供太多信息。
也许它在 jQuery 选择器中用于查找给定标签实例的相应输入元素：
var label = $('label');
label.each(function() {
// get the corresponding input element of the label:
var input = $('#' + $(this).attr('for'));
});
于 2012-10-15T10:59:04.237 回答
67
要将<label>与<input>元素相关联，您需要提供<input>anid属性。然后<label>需要一个与输入相同的for属性：valueid
<label for="username">Click me</label>
<input type="text" id="username">
for属性将 a与<label>元素<input>相关联；这提供了一些主要优点：
1. 标签文本不仅与其相应的文本输入在视觉上相关联；它也以编程方式与之关联。这意味着，例如，当用户专注于表单输入时，屏幕阅读器会读出标签，使辅助技术用户更容易理解应该输入哪些数据。
2. 您可以单击相关标签来聚焦/激活输入，以及输入本身。这种增加的命中区域为任何试图激活输入的人提供了优势，包括那些使用触摸屏设备的人。
或者，您可以将<input>直接嵌套在 中<label>，在这种情况下，不需要 forand属性，因为关联是隐式的：id
<label>Click me <input type="text"></label>
注意：
一个input标签可以关联多个标签。
当<label>单击或点击 a 并且它与表单控件关联时，也会为关联的控件引发单击事件。
可访问性问题
不要在标签内放置交互式元素，例如锚点或按钮。这样做会使人们难以激活与标签关联的表单输入。
标题
在 a 中放置标题元素<label>会干扰多种辅助技术，因为标题通常用作导航辅助。如果需要在视觉上调整标签的文本，请改用应用于<label>元素的 CSS 类。
如果表单或表单的一部分需要标题，请使用<legend>放置在<fieldset>.
纽扣
具有声明和有效值属性的<input>元素type="button"不需要与之关联的标签。这样做实际上可能会干扰辅助技术解析按钮输入的方式。这同样适用于<button>元素。
参考： https ://developer.mozilla.org/en-US/docs/Web/HTML/Element/label
于 2020-03-21T09:47:38.127 回答
13
我觉得有必要回答这个问题。我也有同样的困惑。
<p>Click on one of the text labels to toggle the related control:</p>
<form action="/action_page.php">
<label for="female">Male</label>
<input type="radio" name="gender" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female"><br>
<label for="other">Other</label>
<input type="radio" name="gender" id="other" value="other"><br><br>
<input type="submit" value="Submit">
</form>我将“男性”标签上的 for 属性更改为女性。现在，如果您单击“男性”，则会检查“女性”收音机。
就那么简单。
于 2017-07-25T15:36:05.927 回答
5
一个快速的例子：
<label for="name">Name:</label>
<input id="name" type="text" />
当您单击标签时，该for=""标签也可以让输入聚焦。
于 2012-10-15T10:59:27.010 回答
5
你用它和标签来表示两个对象属于一起。
<input type="checkbox" name="remember" id="rememberbox"/>
<label for="rememberbox">Remember your details?</label>
这也意味着单击该标签将更改复选框的值。
于 2012-10-15T10:59:34.173 回答
4
仅供参考 - 如果您在打字稿环境中，例如
<label for={this.props.inputId}>{this.props.label}</label>
你需要使用 htmlFor
<label htmlFor={this.props.inputId}>{this.props.label}</label>
于 2019-04-08T10:25:48.773 回答
3
于 2012-10-15T10:59:26.733 回答
3
标记的for属性<label>应该等于相关元素的 id 属性才能将它们绑定在一起。
于 2012-10-15T11:01:22.903 回答
1
它<label>用于 html 的文本
例如。
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"><br>
于 2012-10-15T10:58:56.477 回答
1
它将标签与输入元素相关联。HTML 标签旨在向各种类别的用户传达特殊含义。以下是标签的含义：
- 对于有运动障碍的人（也适用于普通鼠标用户）：可以单击正确使用的标签标签以访问相关的表单控件。例如。用户可以点击更容易点击的标签并切换复选框，而不是特别点击复选框。
- 对于有视觉障碍的用户：有视觉障碍的用户使用屏幕阅读器，只要表单控件获得焦点，屏幕阅读器就会读取关联的标签标签。它可以帮助用户了解他们原本看不到的标签。
于 2020-06-08T12:40:58.800 回答
-3
<label>这是标签的属性：http: //www.w3schools.com/tags/tag_label.asp
于 2012-10-15T10:59:39.697 回答