如下图一行表格中有两个点击事件：
1. 点击某一行时，需要跳转页面跳转；
2. 点击删除按钮时，删除该行；
当我点击删除按钮后，不仅触发了自己的点击事件，也跳转了页面。
原因：这是由于子元素继承了父元素身上的方法。
解决方法：给子元素也就是图中的删除按钮给一个 event.stopPropagation() 的方法，来阻止事件冒泡就OK了。这样就不会相互影响了。
后续补充：
在vue中我们可以直接给点击事件一个stop修饰符就可以解决：
eg：@click.stop="hlandClick()"
如下图一行表格中有两个点击事件： 1. 点击某一行时，需要跳转页面跳转； 2. 点击删除按钮时，删除该行； 当我点...
注：父元素和子元素都有click事件绑定，当点击子元素，希望执行子元素的事件而不执行父元素事件，在子元素事件开始时...
1.子元素浮动导致父元素高度(父元素坍塌) 未设置高度的父元素中，如果有子元素浮动(float)，由于子元素不占据...
如果给父级元素增加字体属性，子元素也会有相同属性，（特例除外）在实际应用中，往往会给予子元素不同属性值，去覆盖父元...
时间冒泡就是说: 当点击子元素的时候, 父元素或者祖先元素如果也绑定了点击事件, 那么父元素或者祖先元素的事件也会...
背景 在开发中，经常遇到父级元素带有点击事件，而其子级元素也有点击事件。且二者的具有不同的逻辑处理。在点击子级...
测试代码 效果如图 当我们点击子元素(黄色区域)时会先触发子元素的点击事件，然后会继续触发父元素的点击事件，阻止冒...
在测试小程序的时候，发现了这样的一个bug，点击子元素事件d的时候触发父元素的点击事件，从而执行父级的点击事件，跳...
在测试小程序的时候，发现了这样的一个bug，点击子元素事件d的时候触发父元素的点击事件，从而执行父级的点击事件，跳...
Vue 语法中使用的 注意事项 在DOM中 可能存在 点击触发子元素事件，父元素事件也跟着响应了 （这叫...
本文标题：子元素不继承父元素中的点击事件
本文链接：https://www.haomeiwen.com/subject/iluructx.html
网友评论