是否可以將內部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