事件绑定时，用console.log有效，用alert失效
我们都知道mouseup、mousedown、click的执行顺序是mousedown、mouseup、click
现在有这样一段代码
<body>
<input id='ipt1' type="text" value="demo">
<script>
var ipt = document.getElementById('ipt1');
ipt.addEventListener('click', function(e) {
console.log(e.type);
});
ipt.addEventListener('mouseup' ,function(e) {
console.log(e.type);
});
ipt.addEventListener('mousedown', function(e) {
console.log(e.type);
});
</script>
</html>结果：
但是如果把console.log全部换成alert，就仅会触发mousedown
<body>
<input id='ipt1' type="text" value="demo">
<script>
var ipt = document.getElementById('ipt1');
ipt.addEventListener('click', function(e) {
alert(e.type);
});
ipt.addEventListener('mouseup' ,function(e) {
alert(e.type);
});
ipt.addEventListener('mousedown', function(e) {
alert(e.type);
});
</script>
</body>
有人知道为什么吗?
将提示框点掉以后mouseup和click也不会出现。
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（7）
console 会阻断 js 执行，所以你 mousedown 时触发
alert('mouseDown')，之后的 click 和 mouseup 都因为处于 alert 状态被阻塞了，所以没有能监听到这个状态。你把 mousedown 用 alert， 其他两个用 console 试试大概明白了吧。
再做个实验：依然 mousedown 绑定 alert，其余 console，然后鼠标摁下不送开，触发 alert 后用键盘的 enter 把 alert 关掉，此时再松开鼠标，就能看到 mouseup 和 click 的 console 了。
因为你弹完这个alert之后，浏览器就阻塞了，然后你是不是要去点确定，这个时候就不会触发接下来的mouseup 和 click。
假如你把 mousedown这个监听删除掉，或者改成 console.log， 就会发现后面的都会触发。
mousedown时触发alert('mouseDown')，而alert会阻止后面的代码运行。
你要确定之后才能出现第二个啊
alert抢走了焦点
可以看一看这个链接：http://www.cnblogs.com/firstF...讲很清楚；其他同意楼上的回答。
谢谢各位
~~~