JS 防止父元素事件冒泡触发

最新推荐文章于 2024-07-25 20:08:25 发布

行一米

最新推荐文章于 2024-07-25 20:08:25 发布

阅读量1k

点赞数

分类专栏： JS 文章标签： javascript

本文链接：https://blog.csdn.net/baidu_36415076/article/details/53192734

版权

JS 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

解决办法：event.stopPropagation(); 加重子节点的触发事件权重。

<div onclick="showFather();" style="width: 100px;height: 100px;background: red">
    <span  onclick="showSon();" style="width: 50px;height: 50px;background: #fff">冒个泡</span>
</div>

<div onclick="showFather();" style="width: 100px;height: 100px;background: green">
    <span  onclick="showDisSon();" style="width: 50px;height: 50px;background: #fff">禁止冒泡</span>
</div>
<script>
    function showFather(){
        alert("父节点");
    }
    function showSon(){
        alert("冒个泡子节点");
    }
    function showDisSon(){
        event.stopPropagation();
        alert("禁止冒泡子节点");
    }
</script>