为什么onclick元素会为label元素触发两次

作者 
window.onload=function（）{
var wow=document.getElementById（“wow”）；
wow.onclick=function（）{
警报（“hi”）；
}
}
&lt；标签id=“wow”&gt&书信电报；输入type=“checkbox”name=“checkbox”value=“value”&gt；文本&lt/标签&gt

这是我的代码，当我点击“文本”时，它会提醒hi两次，但当我点击框时，onclick元素只会触发一次，为什么

当你点击标签时，它会触发点击处理程序，你会得到一个警报

但是，单击标签也会自动向关联的输入元素发送单击事件，因此这被视为单击复选框。然后，事件冒泡导致在包含元素（即标签）上触发click事件，从而再次运行处理程序

如果将HTML更改为此，则不会收到双重警报：

&lt；输入id=“wowcb”type=“checkbox”name=“checkbox”value=“value”&gt；
&lt；label id=“wow”for=“wowcb”&gt；文本&lt/标签&gt；

标签现在使用for属性与复选框关联，而不是环绕它

演示

相关文章：

  1. 如何使图元水平居中
  2. 使用CSS更改HTML5输入的占位符颜色
  3. 为什么HTML认为“chucknorris”是一种颜色？
  4. 在CSS中设置单元格填充和单元格间距？

发表评论

© 2026 开发百科-程序代码问答平台 • Built with