Question

例如，给定：

<label for="username">Username:</label>
<input id="username" name="username" value="" />

当您点击“用户名：”标签时，焦点将转到相应的表单字段。

如果没有使用JavaScript，当表单字段没有ID时，是否可能有相同的行为？

这将是一个问题的真实世界示例是动态构造的表单，您可以在其中向表单添加类似的字段，或者可以添加同一表单的多个实例。

Answer 1

是的，标签隐含地与它所包含的第一个输入相关联：

<label>Username:
<input name="username" value="" />
</label>

来自W3：

要隐式地将标签与另一个控件相关联，控制元素必须位于LABEL元素的内容中

事实上，我认为将标签中的输入嵌套更好 - 练习;它可以更加语义化，在某些情况下通过消除单选按钮或复选框及其标签之间的不可点击空格，可以产生更好的ui。

Answer 2

我正在考虑的解决方案是在ID上添加一些内容以使其独一无二。例如，时间戳：

<label for="username-12019734517">Username:</label>
<input id="username-12019734517" name="username" value="" />

Answer 3

如果对你的问题有一个真实的答案，我会感到惊讶，但我会拭目以待。解决方法是以编程方式构造ID。因此，如果您有要复制的表单，请为每个实例指定自己的名称和ID，如form0, form1，其输入ID如form0_username等。