HarmonyOS鸿蒙Next中点击高层级的div，底层的div依旧触发了点击事件

HarmonyOS鸿蒙Next中点击高层级的div，底层的div依旧触发了点击事件 遮罩层固定定位层级2000，底层div固定定位层级100，当我点击遮罩层的时候，底层div的点击事件也被触发了

js开发方式，api Version 6

2 回复

楼主你好，js开发中，click事件默认是冒泡事件，如果想阻止可以在底层的点击事件上阻止事件往上传递，使用grab:click.bubble；地址：https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V3/js-framework-syntax-hml-0000001430600513-V3#ZH-CN_TOPIC_0000001430600513__%E6%99%AE%E9%80%9A%E4%BA%8B%E4%BB%B6%E7%BB%91%E5%AE%9A

更多关于HarmonyOS鸿蒙Next中点击高层级的div，底层的div依旧触发了点击事件的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，如果点击高层级的div时底层的div也触发了点击事件，这通常是由于事件冒泡机制导致的。事件冒泡是指事件从最内层元素开始，逐级向上传播到外层元素。要阻止底层div触发点击事件，可以在高层级div的事件处理函数中调用event.stopPropagation()方法，阻止事件继续冒泡。

例如：

highLevelDiv.onclick = function(event) {
    event.stopPropagation();
    // 其他处理逻辑
};

这样可以确保点击高层级div时，底层div不会接收到点击事件。

回到顶部