JavaScript怎么阻止冒泡事件
本帖最后由 人心所向 于 2023-2-16 23:28 编辑图一代码截图（在DIV-A中加入了阻止事件冒泡的代码）：
https://s1.ax1x.com/2023/02/16/pSbNuM6.png
图二预览截图（并没有阻止冒泡）：
https://s1.ax1x.com/2023/02/16/pSbNGid.png
图三代码截图（我把阻止冒泡的代码放入了DIV-B，成功了）：
https://s1.ax1x.com/2023/02/16/pSbNLy6.png
图四预览截图：
https://s1.ax1x.com/2023/02/16/pSbUPSI.png
在DIV-A的代码中已经加入了以下代码（来自百度搜索）
e.preventDefault();
e.stopPropagation();
return false;
也就是在DIV-A的事件里加入的阻止冒泡，但是测试时，点击DIV-B区域依然会触发DIV-A的alert提示框，但是把代码移到DIV-B内，却可以阻止冒泡。
我的想法：
如果DIV-A，也就是如果父元素内有很多个子元素，我总不能在每个子元素里都加个 e.stopPropagation(); 来阻止冒泡，有什么方法能在父元素中直接控制不让子元素事件冒泡。
刚刚百度了下，已经知道大概原理了，是我理解错了。 不侦听子元素就没得事
{:301_998:} 一般情况下不需要阻止所有子元素的冒泡事件啊，冒泡酒冒泡啊，需要手动阻止冒泡的不多 点击事件是先子元素后父元素逐层向上触发的
B是A的子元素，所以先触发B后触发A，A禁止冒泡了就不会再触发A的父元素事件了
如果DIV-A，也就是如果父元素内有很多个子元素，我总不能在每个子元素里都加个 e.stopPropagation(); 来阻止冒泡，有什么方法能在父元素中直接控制不让子元素事件冒泡。
至于这个，你可以利用事件委托，把所有子元素的点击事件委托给父元素A，把代码全部写在A的事件监听里，通过e.target来判断实际是点击了哪个元素，再触发对应的函数 有的是有也是需要利用事件冒泡来做一些逻辑处理的，事件委托，事件中转之类的 事件委托
页:
[1]