window.onload = function(){
var wow = document.getElementById("wow");
wow.onclick = function(){
alert("hi");
}
}
<label id="wow"><input type="checkBox" name="checkBox" value="value">Text</label>
这是我的代码,当我点击“文本”时,它会提醒两次,但是当我点击框时,onclick元素只会触发一次,为什么?
当您点击
标签时,它会触发点击处理程序,并获得警报.
但点击一个标签也会自动发送一个点击事件到相关的输入元素,所以这被视为点击复选框.然后事件冒泡导致在包含元素(这是标签)上触发click事件,因此您的处理程序将再次运行.
如果您将HTML更改为此,您将无法获得双重警报:
<input id="wowcb" type="checkBox" name="checkBox" value="value">
<label id="wow" for="wowcb">Text</label>
该标签现在与使用for属性的复选框相关联,而不是围绕它.
DEMO
原文链接:https://www.f2er.com/js/155551.html