详细描述一下问题,有两个事件,一个是input丢失焦点事件A,一个是button的点击事件B,当input获取到焦点时,再去点击button,这样会直接触发A事件,无法触发B事件。
网上搜了好多,经过一一鉴别,貌似都不管用,不知道是不是我测试的姿势不对。
最终将button的点击事件改为了鼠标点下的事件,也就是onmousedown事件,最终解决了。
因为啥呢,主要是onclick = onm ousedown + onm ouseup ,也就是说我直接在鼠标起来之前就把事件提前触发了,应该就跑在了失去焦点事件前边,所以就会先执行onmousedown的事件,然后再执行input的失去焦点事件。
具体代码如下:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>测试双事件冲突</title> </head> <body> <div> <button onblur="loseMe()">不要离开我</button> <button onm ousedown="clickMe()">快点点我</button> </div> <script> function loseMe(){ alert("不要离开我") } function clickMe(){ alert("点了我一下") } </script> </body> </html>
效果图: