原生JS实现跨浏览器获取鼠标按键值

作者:竹影

时间:2026-10-27

浏览:181

本文介绍如何使用原生JavaScript实现跨浏览器获取鼠标按键值。通过判断e.button和window.event.button,兼容W3C标准和IE浏览器,返回0、1、2分别代表左键、中键和右键。

文章目录

原生JS实现跨浏览器获取鼠标按键值

代码示例如下:

 
document.onmousedown = function( e ){
alert(getButton(e)) // e.button W3C标准下获取鼠标按键:0代表左键,1代表中键,2代表右键;而IE浏览器(主要是IE8及以下版本)的映射为:1代表左键,4代表中键,2代表右键
}; 
function getButton(e){
/* 
1、window.event属性在IE和Chrome浏览器中均受支持
2、但Chrome浏览器同时也兼容W3C标准
3、因此,当W3C与IE标准均支持时,优先采用W3C作为标准化依据
*/ 
if( e ){ // 首次判断:若存在e对象,则Chrome浏览器以W3C标准为准
return e.button;
}else if( window.event ){
switch( window.event.button ){
case 1 : return 0; // 返回鼠标左键对应的值
case 4 : return 1; // 返回鼠标中键对应的值
case 2 : return 2; // 返回鼠标右键对应的值
case 0 : return 2; // 返回鼠标右键对应的值;此情况主要见于360浏览器,其在IE内核模式下返回0代表未按下鼠标键
}; 
}; 
}; 

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章