常见鼠标事件

鼠标触发CSS事件 
说明： 
onMouseDown 按下鼠标时触发 
onMouseOver 鼠标经过时触发 
onMouseUp 按下鼠标松开鼠标时触发 
onMouseOut 鼠标移出时触发 
onMouseMove 鼠标移动时触 

复制代码代码如下:

 
 
 
 
 
 
 

 


鼠标响应事件 当鼠标经过移出时切换css

 

• onMouseDown 按下鼠标时触发 
  
• onMouseOver 鼠标经过时触发 
  
• onMouseUp 按下鼠标松开鼠标时触发 
  
• onMouseOut 鼠标移出时触发 
  
• onMouseMove 鼠标移动时触发
 

 
 
 

复制代码代码如下:

鼠标经过表格变色样式:
 

复制代码代码如下:

 
控制表格隔行变色: 
简单应用: 
 

添加CSS文件引用: 

复制代码代码如下:

 

常见的有以下8个： 
mousedown：鼠标的键钮被按下。 
mouseup：鼠标的键钮被释放弹起。 
click：单击鼠标的键钮。 
dblclick：鼠标的键钮被按下。 
contextmenu ：弹出右键菜单。 
mouseover：鼠标移到目标的上方。 
mouseout：鼠标移出目标的上方。 
mousemove：鼠标在目标的上方移动。 
mousedown事件与mouseup事件可以说click事件在时间上的细分，顺序是mousedown => mouseup => click。因此一个点击事件，通常会激发几个鼠标事件。 

 
 

 
请在这里点击，测试一个点击到底捆绑了多少种鼠标事件？！ 

 

清空

 

 

===============================================================

事件	浏览器支持	描述
onClick	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	鼠标点击事件，多用在某个对象控制的范围内的鼠标点击
onDblClick	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	鼠标双击事件
onMouseDown	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	鼠标上的按钮被按下了
onMouseUp	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	鼠标按下后，松开时激发的事件
onMouseOver	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	当鼠标移动到某对象范围的上方时触发的事件
onMouseMove	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	鼠标移动时触发的事件
onMouseOut	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N3 | O3	当鼠标离开某对象范围时触发的事件
onKeyPress	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象]
onKeyDown	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象]
onKeyUp	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象]
页面相关事件
事件	浏览器支持	描述
onAbort	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N3 | O	图片在下载时被用户中断
onBeforeUnload	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N | O	当前页面的内容将要被改变时触发的事件
onError	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N3 | O	捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误
onLoad	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成
onMove	HTML: 2 | 3 | 3.2 | 4  Browser: IE | N4 | O	浏览器的窗口被移动时触发的事件
onResize	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N4 | O	当浏览器的窗口大小被改变时触发的事件
onScroll	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N | O	浏览器的滚动条位置发生变化时触发的事件
onStop	HTML: 2 | 3 | 3.2 | 4  Browser: IE5 | N | O	浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断
onUnload	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	当前页面将被改变时触发的事件
表单相关事件
事件	浏览器支持	描述
onBlur	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	当前元素失去焦点时触发的事件 [鼠标与键盘的触发均可]
onChange	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可]
onFocus	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	当某个元素获得焦点时触发的事件
onReset	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N3 | O3	当表单中RESET的属性被激发时触发的事件
onSubmit	HTML: 2 | 3 | 3.2 | 4  Browser: IE3 | N2 | O3	一个表单被递交时触发的事件
滚动字幕事件
事件	浏览器支持	描述
onBounce	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N | O	在Marquee内的内容移动至Marquee显示范围之外时触发的事件
onFinish	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N | O	当Marquee元素完成需要显示的内容后触发的事件
onStart	HTML: 2 | 3 | 3.2 | 4  Browser: IE4 | N | O	当Marquee元素开始显示内容时触发的事件