是否可以将内部Div Click绑定到外部Div？

Question

我试图在每次单击Div时触发一个功能，但是该Div有一个内部Div，这意味着如果我在内部单击，它将触发onClick但在错误的Div上

我在Internet上四处张望，但找不到任何答案。

一个返回下面代码的map函数

<Card onClick={props.setSelectedTemplate}  key={template.id} className="AdCopies" id={template.id.toString()}>
        <SimpleAdCopy headlines={template.headlines} descriptions={template.descriptions} url={'www.google.com'}/>
 </Card>

function handleClick(event) {
    console.log(event.target.id)
  }

即使单击内部Div，我也需要始终将单击限制在外部div上

Answer 1

您要使用event.currentTarget而不是event.target 。 target是单击的对象， currentTarget是事件绑定到的元素。

Answer 2

据我了解，这是关于React的，不是吗？ 无论如何，如果您想停止事件冒泡（ https://www.sitepoint.com/event-bubbling-javascript/ ），则应在内部div中添加onClick处理程序，并在回调内部执行以下操作

<SimpleAdCopy onClick= {event => event.stopPropagation()} />

它停止事件冒泡，并让您避免在外部div上进行onClick调用

关于停止传播： https : //developer.mozilla.org/zh-CN/docs/Web/API/Event/stopPropagation