我在window
上有一个点击事件。复选框还有一个复选框和一个标签。当您点击标签时,window's
点击事件会被调用两次,一次用于复选框,一次用于标签。
我尝试将e.stopPropagation();
添加到事件监听器,但它没有帮助。为什么事件被调用两次,我该怎么做才能解决它?
var checkbox = document.getElementById('checkbox-id');
window.addEventListener('click', function(e) {
console.log(checkbox.checked, e.target)
});
console.clear();

input {
display: none;
}
label {
background-color: orange;
width: 100px;
height: 100px;
display: block;
}
input:checked label {
background-color: green;
}

<input type="checkbox" name="checkbox" id="checkbox-id" />
<label for="checkbox-id"></label>
&#13;
答案 0 :(得分:0)
事件起泡。要停止它,请使用stopPropagation()
方法:
var checkbox = document.getElementById(&#39; checkbox-id&#39;);
window.addEventListener('click', function(e) {
console.log(checkbox.checked, e.target)
e.stopPropagation();
});
有关事件顺序和冒泡的更多详细信息:http://www.quirksmode.org/js/events_order.html