鼠标事件之JS

<p id="p1">Test mousedown</p>
02<p id="p2">Test mouseup</p>
03<p id="p3">Test click</p>
04<p id="p4">Test dbclick</p>
05  
06<script type="text/javascript">
07    function $(id){return document.getElementById(id)}
08      
09    var p1 = $('p1'), p2 = $('p2'), p3 = $('p3'), p4 = $('p4');
10    p1.onmousedown = function(e){
11        e = window.event || e;
12        alert(e.button);
13    }
14    p2.onmouseup = function(e){
15        e = window.event || e;
16        alert(e.button);
17    }
18    p3.onclick = function(e){
19        e = window.event || e;
20        alert(e.button);
21    }
22    p4.ondbclick = function(e){
23        e = window.event || e;
24        alert(e.button);
25    }       
26</script>

2011040613024156.png

即:
IE6/7/8中,mousedown/mouseup 事件中获取左键的值为1,click事件中获取的却是0。
其它浏览器,mousedown/mouseup/click 事件中获取左键值均为0。完全遵循标准。
所有浏览器,dbclick事件中均无法获取

2011040613030645.png

即:
IE6/7/8中,mousedown/mouseup 事件中获取中键的值为4。
IE6/7中,click事件无法获取中键的值。IE8则可以,但值为0。
Firefox3.6/Chrome7/Safari5中,mousedown/mouseup 事件中获取中键值为1。
Chrome7/Safar5中,click事件也能获取中键值,亦为1。
Opera10中无法获取中键值。

2011040613050736.png

即:
所有浏览器,mousedown/mouseup事件中均能获取右键值,且都为2。
所有浏览器,click/dbclick事件中均不能获取到右键值。

以上可看到,判断鼠标按下了哪个键 ,应该选择合适的事件 。这里应选mousedown/mouseup。Opera10中仍然无法获取到中键的值,因为Opera压根不触发中键的事件(mousedown,mouseup,click,dbclick)。

以下代码将IE6/7/8的值转换成符合W3C标准的

01var ie678 = !-[1,];
02function getButton(e){
03    var code = e.button;
04    var ie678Map = {
05        1 : 0,
06        4 : 1,
07        2 : 2
08    }
09    if(ie678){
10        return ie678Map[code];
11    }
12    return code;
13}

转载于:https://www.cnblogs.com/qingci/archive/2011/04/07/2007414.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值