Javascript 在jQuery触发器事件之后停止事件传播

情况是这样的。有按钮，也有隐藏的div。用户单击按钮后，会显示隐藏的div，同时我正在使用

on（）

在主体上添加事件侦听器，以检查用户是否单击了该隐藏的div。在该div之后，应再次隐藏并单击事件分离

一切正常，但只有当用户点击按钮。如果我使用trigger（）函数触发click，则立即调用

on（）

函数，并且不会显示隐藏的div

代码如下：

$（“按钮”）。单击（函数（e）{
e、 停止传播（）；
$（'div'）。toggleClass（'active'）；
if（$（'div'）.hasClass（'active'））{
$（'body'）。on（'click.div'，函数（e）{
console.log（'body clicked'）
if（！$（e.target）.最近（'div'）.长度）{
$（'div'）.removeClass（'active'）；
$（'body'）.off（'.div'）；
}
});
}否则{
$（'body'）.off（'.div'）；
}
});
$（'input'）。单击（函数（）{
$（'button'）。触发器（'click'）；
});
div{
显示：无；
}
活动分区{
显示：块；
}

点击
这是隐藏的
原因是，单击通过调用
触发器响应的
输入
会传播到
正文
，因此它会由您添加的
正文
处理程序处理。即触发此事件处理程序的单击：

$('input').click(function(){
  $('button').trigger('click');
});

…得到处理；当然，你稍后会再发一封

要修复此问题，请停止该单击传播：

$('input').click(function(e){
  e.stopPropagation();
  $('button').trigger('click');
});


$（“按钮”）。单击（函数（e）{
e、 停止传播（）；
$（'div'）。toggleClass（'active'）；
if（$（'div'）.hasClass（'active'））{
$（'body'）。on（'click.div'，函数（e）{
console.log（'body clicked'）
if（！$（e.target）.最近（'div'）.长度）{
$（'div'）.removeClass（'active'）；
$（'body'）.off（'.div'）；
}
});
}否则{
$（'body'）.off（'.div'）；
}
});
$（“输入”）。单击（函数（e）{
e、 停止传播（）；
$（'button'）。触发器（'click'）；
});
div{
显示：无；
}
活动分区{
显示：块；
}

点击
这是隐藏的
是的，这就是原因。有一段时间我一直在想，也许我需要
stopPropagation
在带有触发器的函数中，然后放手。谢谢