JavaScript onmouseup 事件：鼠标任何一个按键被松开_JavaScript基础教程

JavaScript onmouseup 事件

当鼠标按键（任何一个键）被松开时，会触发 onmouseup 事件，如下例子所示：

<html>
<body>
<p>
<img src="http://www.5idev.com/static/images/article/logo_mark.gif" onmouseup="alert('您点击了这幅
图片！')" />
</p>
</body>
</html>

在这个例子中，将鼠标放在图片上，当按下任何一个鼠标键后松开时，就会弹出提示窗口：您点击了这幅图片！。

您可以点击下面的图片试试：

5idev logo 示意图

适当延长按下鼠标键后释放鼠标键的事件，能感觉得到 onmouseup 事件是在鼠标按键释放的时候触发的。在应用中，

识别用户的按键

利用 JavaScript onmouseup 事件的 event.button 属性，可以识别用户按下的键，将上面的例子进行改造：

<html>
<script type="text/javascript">

function pressButton(evt){
    var key;
    switch( evt.button )
    {
        case 1: key = "左键"; break;
        case 2: key = "右键"; break;
        case 3: key = "左键和右键"; break;
        case 4: key = "中键"; break;
        case 5: key = "左键和中键"; break;
        case 6: key = "中键和右键"; break;
        case 7: key = "所有键"; break;
    }
    alert(key + "点击了图片！");
}

</script>
<body>
<p>
<img src="http://www.5idev.com/static/images/article/logo_mark.gif" onmouseup="pressButton(event)" />
</p>
</body>
</html>

运行上面的例子，不同的按键，会有不同的提示信息。除了 onmouseup 事件，也可以利用 onmousedown 事件来识别用户的按键，并且 onmouseup 事件通常无法识别双键同时按下的效果，而 onmousedown 事件则可以识别。