单击时，输入字段/文本框不会保持选中状态

Question

我是HTML的新手。这可能是非常基本的，但无论我做什么，我都无法让我的形式发挥作用。每当我单击输入字段（文本区域）时，只要我按住鼠标，输入字段就会保持选中状态，但每当我释放它时，焦点都会立即返回到表单的第一个字段。这是HTML / CSS吗？我不知道如何解决它。

这是我正在处理的表单的网址（http://www.seanmccully.com/apps/langham/tea.html） - 但现在可能已修复。您可以看到您无法选择名字，姓氏，城市，电子邮件（您只能通过标签输入数据）。

Answer 1

这是因为您已将所有表单元素包装在一个label元素中。摆脱它，它会工作正常。

label元素只能与单个表单控件关联，单击label会将焦点放在其关联的控件上。由于您在label中有多个控件，因此它与第一个控件相关联，当点击事件向上传播时，点击任何其他表单控件都会到达标签并使其关注其关联控件（第一个）。

如果您想使用label元素，则每个控件都需要一个元素。您可以将span元素更改为label元素，并使用for属性将该标签与控件相关联，或者将每个控件包装在标签中：

<label class="labelstyle" for="fname">First Name</label>
<input name="fname" type="text" class="fieldstyle" id="fname" size="25" maxlength="50"/>

<!-- or -->

<label class="labelstyle">
    First Name <input name="fname" type="text" class="fieldstyle" id="fname" size="25" maxlength="50"/>
</label>

Answer 2

似乎我发现它出了问题：

1. 将原始代码复制到记事本中（编写HTML时始终需要它）。
2. 删除不必要的代码以更清楚地查看问题（例如CSS代码甚至脚本代码）。
3. 然后仔细检查代码树！我在这里和那里看到了标签标签！

你知道，你不应该把这个家伙放在任何地方。 你让他总是专注，而不是输入命名的文字家伙。 所以试着删除标签;你会看看它。