Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

Firefox上鼠标中键的click事件问题

  在Chrome和IE上,鼠标中键可以用来点击按钮,点击时正常触发click事件。但是在Firefox上鼠标中键就不能点击按钮,甚至不能在元素上触发click事件。但元素确实可以捕获事件,只是不调用绑定的click监听函数而已,其它鼠标事件都没问题。
  下面这个测试在Firefox上用鼠标中键点按钮是没效果的,甚至按钮都不会凹陷下去。 <input type="button" value="中键点我" id="btn" />
<script>
btn.onclick=function(){
  console.log("ok");
};
</script>
  如果只是为了监听鼠标按下和松开,可以使用mousedown和mouseup事件,这两个事件是可以正常处理鼠标中键的。 <input type="button" value="中键点我" id="btn" />
<script>
btn.onmousedown=function(e){
  console.log("down");
},btn.onmouseup=function(e){
  console.log("up");
};
</script>
  但如果真正需要click的话,用这两个事件来模拟反而会更麻烦。鼠标中键点击在元素上虽然不会触发绑定在click上的事件监听,但是事件确实产生了,而且可以冒泡。因此可以从document或viewport上监听click,再从事件参数的target中获取触发元素。所以把这个事件监听放到文档上就可以正常工作。 <input type="button" value="中键点我" id="btn" />
<script>
document.onclick=function(e){
  if(e.target!=btn)return;
  console.log("ok");
};
</script>
  这么一折腾就可以使用click了,但遗憾的是按钮被点击时依然不会凹陷下去。
网名:
34.203.213.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^