将for和name属性一起使用

  • 本文关键字:一起 属性 name for html
  • 更新时间 :
  • 英文 :


之前我研究过,对于text类型的输入标记,label标记的id属性和for属性应该具有相同的值。

现在我正在阅读一篇教程,并阅读了这段代码,在radio buttons的情况下,forname属性具有相同的值,而不是idfor

我知道id对于一个元素是唯一的。我的第一个问题是,在单选按钮的情况下使用for属性的目的是什么?

<label for="status">Status:</label>
<input type="radio" id="pending" name="status"> Pending
<input type="radio" id="resolved" name="status"> Resolved
<input type="radio" id="rejected" name="status"> Rejected

我的第二个问题是,与这里的text类型输入标记不同,idfor属性没有相同的值。这是一个有效的代码吗?如果它是有效的,那么为forname属性提供相同值的目的是什么?

现在我正在阅读一篇教程,并完成了这段代码,在单选按钮的情况下,for和name属性具有相同的值,而不是id和for。

这是一个错误

我知道id对于一个元素是唯一的。我的第一个问题是,在单选按钮的情况下使用for属性的目的是什么?

for属性的值应与标记的单选按钮的id的值相同

我的第二个问题是,与这里的文本类型输入标记不同,id和for属性没有相同的值。这是一个有效的代码吗?如果它是有效的,那么为for和name属性提供相同值的目的是什么?

完全有效。

该名称确定提交表单数据时的键,并对单选按钮进行分组。

id用于唯一地标识它(例如,用于标签(。

<label for="status">Status:</label>
<input type="radio" id="pending" name="status"> Pending
<input type="radio" id="resolved" name="status"> Resolved
<input type="radio" id="rejected" name="status"> Rejected

输入右边的单词应该是这里的标签。

标签应该是字段集的图例。

<fieldset>
<legend>Status</legend>
<input type="radio" id="pending" name="status"> <label for="pending">Pending</label>
<input type="radio" id="resolved" name="status"> <label for="resolved">Resolved</label>
<input type="radio" id="rejected" name="status"> <label for="rejected">Rejected</label>
</fieldset>

请注意,在现场演示中,您可以单击标签来触发相关的单选按钮。(除了更大的点击目标和符合标准UI惯例之外,这也有利于屏幕阅读器和其他AT软件(。

这不是label的正确用法。

label应该与单个控件关联,因此在您的情况下,每个input都需要一个label。如果你想把它们分组,你可以把一个带有legendfieldset元素添加到";标签";

类似的东西

<fieldset>
<legend>Status:</legend>
<input type="radio" id="pending" name="status"> <label for="pending">Pending</label>
<input type="radio" id="resolved" name="status"> <label for="resolved">Resolved</label>
<input type="radio" id="rejected" name="status"> <label for="rejected">Rejected</label>
</fieldset>

(你当然可以按照你想要的方式来设计它(

最新更新