之前我研究过,对于text
类型的输入标记,label
标记的id
属性和for
属性应该具有相同的值。
现在我正在阅读一篇教程,并阅读了这段代码,在radio buttons
的情况下,for
和name
属性具有相同的值,而不是id
和for
。
我知道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
类型输入标记不同,id
和for
属性没有相同的值。这是一个有效的代码吗?如果它是有效的,那么为for
和name
属性提供相同值的目的是什么?
现在我正在阅读一篇教程,并完成了这段代码,在单选按钮的情况下,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
。如果你想把它们分组,你可以把一个带有legend
的fieldset
元素添加到";标签";
类似的东西
<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>
(你当然可以按照你想要的方式来设计它(