onclick触发两次_javascript-为什么onclick会被触发两次？

这是我一直在处理的一小段代码：

我想要的是在单击相同元素时添加一个活动类来标记,并使默认行为保持不变.

我不知道为什么两次触发点击事件？

$('label.add-to-favourite').click(function(e){

alert("here");

$(this).toggleClass('active');

});

.add-to-favourite span{

cursor: pointer;

color: #d2d6de;

}

.add-to-favourite:hover span, .add-to-favourite.active span {

color: #CB3D3D;

}

解决方法:

当您单击标签时,它将触发复选框的单击事件.

但是单击标签还会自动将click事件发送到关联的输入元素,因此将其视为对复选框的单击.然后事件冒泡会导致在包含元素(即标签)上触发click事件,因此您的处理程序将再次运行.

像这样将复选框放在标签外

更新：您也可以按照@Rejith R Krishnan的建议进行操作,并在复选框而不是标签上设置click事件处理程序

标签：javascript,jquery

来源： https://codeday.me/bug/20191026/1939829.html