时间戳

首页 > 解决方案 > div 块正在监听内部和外部事件

javascript - div 块正在监听内部和外部事件

问题描述

单击黑色（外部 div）时会打印外部（没有问题），但单击棕色（内部 div）会打印内部和外部，这就是问题所在。我只想在点击棕色区域时打印内部，在黑色区域点击外部。

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body style="height:100px; width:100px;">
    <div style="width: 100%; height: 100%; background-color: black;" onclick="console.log('outer')">
        <div style="width: 50%; height: 50%; background-color: brown;" onclick="console.log('inner');"></div>
        </div>
    </body>
    </html>

标签： javascripthtmlcss

解决方案

我认为您应该使用该stopPropagation()方法。通过这种方式，您可以防止子/父元素上的事件“冒泡”。

关于它的更多信息可以在这里找到：https ://www.w3schools.com/jsref/event_stoppropagation.asp

推荐阅读