Html 未激活中所需的复选框

当我点击第二个复选框时，第一个复选框被激活

但当我点击第一个复选框时，一切都正常

请单击第二个复选框，查看发生了什么。

我有1000个复选框和更改id不是一个好方法

如果您需要更多详细信息，请对问题进行评论

这是代码，请看一下：

。复选框四{
宽度：14px；
高度：14px；
背景：#dddddd；
保证金：0px 0px；
边界半径：100%；
位置：绝对位置；
利润上限：-20px；
右边距：-18px；
}
.checkboxFour>输入{可见性：隐藏；/*位置：绝对；*//*z-index:-1000；*//*溢出：隐藏；*//*剪辑：矩形（0 0 0 0 0）；*/高度：17px；宽度：14px；边距：-2px；边距右侧：-7px；填充：0；边框：0；}
.复选框4标签{
宽度：10px；
高度：10px；
边界半径：100px；
过渡：所有。5s轻松；
光标：指针；
顶部：0px；
位置：绝对位置；
左：2px；
z指数：1；
背景：ddd；
边缘顶部：2倍；
右边距：2px；
}
.checkboxFour输入[类型=复选框]：选中+标签{
背景：#f83232；
}

重要的






不重要

。复选框四{
宽度：14px；
高度：14px；
背景：#dddddd；
保证金：0px 0px；
边界半径：100%；
位置：绝对位置；
利润上限：-20px；
右边距：-18px；
}
.checkboxFour>输入{可见性：隐藏；/*位置：绝对；*//*z-index:-1000；*//*溢出：隐藏；*//*剪辑：矩形（0 0 0 0 0）；*/高度：17px；宽度：14px；边距：-2px；边距右侧：-7px；填充：0；边框：0；}
.复选框4标签{
宽度：10px；
高度：10px；
边界半径：100px；
过渡：所有。5s轻松；
光标：指针；
顶部：0px；
位置：绝对位置；
左：2px；
z指数：1；
背景：ddd；
边缘顶部：2倍；
右边距：2px；
}
.checkboxFour输入[类型=复选框]：选中+标签{
背景：#f83232；
}

重要的






不重要

发生这种情况，因为您将相同的id-s放入输入，并且两个标签都引用了该id：

。复选框四{
宽度：14px；
高度：14px；
背景：#dddddd；
保证金：0px 0px；
边界半径：100%；
位置：绝对位置；
利润上限：-20px；
右边距：-18px；
}
.checkboxFour>输入{可见性：隐藏；/*位置：绝对；*//*z-index:-1000；*//*溢出：隐藏；*//*剪辑：矩形（0 0 0 0 0）；*/高度：17px；宽度：14px；边距：-2px；边距右侧：-7px；填充：0；边框：0；}
.复选框4标签{
宽度：10px；
高度：10px；
边界半径：100px；
过渡：所有。5s轻松；
光标：指针；
顶部：0px；
位置：绝对位置；
左：2px；
z指数：1；
背景：ddd；
边缘顶部：2倍；
右边距：2px；
}
.checkboxFour输入[类型=复选框]：选中+标签{
背景：#f83232；
}

重要的






不重要

我需要换一种方式！我有1000个复选框！那么你不知道beetwen'for'和'id'用于我需要另一种方式！我有1000个复选框！每个复选框必须有一个特定的id@Alireza“更改id不是好方法”-是的，它是。每个元素都需要唯一的id使用动态id