具有相同名称的复选框的标签

Question

我正在编写一个小应用程序，用户可以通过从复选框列表中选择来定义地图上的弹出窗口。每个复选框对应一个特定的数据值，该列表是动态生成的。

当我获取数据时，我遍历它并按以下格式构建列表：

<label>
    <input type='checkbox' name='enabled_data', value='DATA VALUE' />
    DATA VALUE
</label>

提交表单后，我会获得一系列enabled_data项目，然后我可以使用它们。

但是，只要我尝试将for值附加到标签上，标签就会停止工作 - 可能是因为每个复选框共享相同的名称。

<label for='enabled_data'>

我想我每张地图最终都会有数十个这样的复选框，我想知道这样做的唯一方法是为每个复选框生成某种唯一ID（例如地图名称+ data_value）来获取标签要正常工作吗？

Answer 1

您应该为for属性值提供ID。

  

for = string：   指定用于指示与标题关联的表单控件。   属性的值必须是与标签元素在同一Document中的可标记的与表单相关的元素的ID。

参见 doc

它停止工作，因为没有标识为enabled_data的元素。为inputs指定一个ID，并将其作为相应标签的for属性值。

<label for="check1">DATA VALUE</label>
<input type='checkbox' name='enabled_data' value='DATA VALUE' id="check1" />

此外，您还有2个属性之间的逗号。

<input type='checkbox' name='enabled_data', value='DATA VALUE' />
                                          ^___________________

Answer 2

您看到的for指向元素ID，而不是名称。

<label for="element_id">

请看W3C。