鼠标事件由鼠标或相似的用户动作触发的事件，以下常用的鼠标事件属性
onmousedown 当按下鼠标按钮触发事件
onmouseup 但松开鼠标按钮触发事件
onclick 当单击鼠标触发事件
ondbclick 当双击鼠标触发事件
onmousemove 当鼠标指针移动时触发事件
onmouseover 当鼠标移动至元素之上触发事件
onmouseout 当鼠标移动出元素之外触发事件
onscroll 当滚动元素的滚动条时触发事件
onmousewheel当转动鼠标滚轮时触发事件
ondragstart 当拖放操作开始时被拖放元素触发事件，一般在事件处理函数中设置拖放的数据源
ondrag 拖放过程中被拖放元素触发事件
ondragenter 拖放过程中鼠标进入目标元素内移动时，目标元素触发事件
ondragover 拖放过程中鼠标在目标元素内移动时，目标元素触发事件
ondragleave 拖放过程中鼠标离开目标元素是，目标元素触发该事件
ondrop 当拖放元素投放时，拖放的目标元素触发该事件
ondragend 当拖放操作结束时被拖放元素出发该事件
以下是实例：
<html>
<head>
<meta charset="utf-8">
<title>拖放事件</title>
<style type="text/css">
#div1{width: 200px;height: 200px;border: 2px solid #aaaaaa; }
</style>
<script type="text/javascript">
function allowDrag(ev){
ev.preventDefault();
}
function drag(ev){
ev.dataTransfer.setData("text/plain",ev.target.id);
}
function drop(ev){
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
<p id="p1">可以将下面的图片投放到边框中</p>
<div id="div1" οndragοver="allowDrag(event)" οndrοp="drop(event)"></div>
<img id="img1" src="img/p1.png" draggable="true" οndragstart="drag(event)">
</body>
</html>