a标签导致的按钮子元素点击无效
今天遇到一个很奇葩的问题,mark一下
我在a标签里面包裹了一个button
,点击方法用antd中的气泡弹出窗口,结果就是点击button
一点反应都没有。
我还一直以为是冒泡的问题,但是写了阻止冒泡还是不太行,后来以为是antd
组件的问题,看了好久的antd
代码。
后来去掉a
标签或者把a
标签换成div
标签,问题就解决啦。
我查阅了一下资料,a
标签有一个herf
属性,点击a
标签会进行跳转,点击button
也会跳转, 按照事件冒泡的原理,点击button
,首先会触发button
的点击事件,触发了之后才会触发a
标签的跳转,我在a
标签的herf
中写的是herf='#'
,这个表示的是,点击a
标签,就会跳转到页面的首页,由于我这个页面没有滑动条,其实button
点击事件是先触发了,但是紧随其后a
标签也跳转了,由于速度过快,button
还没有显示,a
就已经刷新了,所以看起来就像button
并没有触发。
除此之外,即使我写了阻止冒泡,也没办法阻止a
标签的刷新。
这个点很重要,记下来,防止忘记,