JavaScript表单事件完整列表与说明

作者:白露时间:2026-10-27 09:48:59浏览:617

本文详细汇总了JavaScript中常见的表单及页面事件,包括onload、onsubmit、onerror、onfocus、onblur等。涵盖鼠标点击、键盘按键、页面加载与卸载等场景,适用于早期浏览器兼容及基础DOM操作学习。

javascript表单事件汇总

JavaScript表单事件完整列表与说明

1. onabort(ns3,ns4,ie4):当用户终止正在打开的网页时触发该事件。


2. onblur(ns3,ns4,ie3,ie4):当某元素失去活动焦点时触发。例如,在文本框中点击后,又在文本框外点击时即产生此事件。


3. onchange(ns3,ns4,ie3,ie4):当网页上某元素的内容发生改变时触发。例如,在文本框中输入文本后,又在文本框外点击时即产生此事件。


4. onclick(ns3,ns4,ie3,ie4):单击网页上的某元素时触发。


5. ondblclick(ns4,ie4):双击网页上的元素时触发。


6. onerror(ns3,ns4,ie4):浏览器在打开网页的过程中发生错误时触发该事件。


7. onfinish(ie4):滚动文本条中的文本完成一次滚动时触发的事件。


8. onfocus(ns3,ns4,ie3,ie4):网页上的元素获得焦点时触发该事件。


9. onkeydown(ns4,ie4):按下任意键时触发该事件。


10. onkeypress(ns4,ie4):按下任意键并释放该键时触发的事件。


11. onkeyup(ns4,ie4):释放按下的按键时触发该事件。


12. onload(ns3、4,ie3、4):网页或图像调入完成后触发该事件。


13. onmousedown(ns4,ie4):在网页的某元素上按下鼠标时触发该事件。


14. onmousemove(ie3、4):在网页的某元素上移动鼠标时触发该事件。


15. onmouseout(ns3、4,ie4):从网页的某元素移出鼠标时触发该事件。


16. onmouseover(ns3、4,ie3、4):鼠标移入网页的某元素时触发该事件。


17. onmouseup(ns4,ie4):释放按下的鼠标时触发该事件。


18. onreset(ns3、4,ie3、4):复位表格时触发该事件。


19. onresize(ns4,ie4):改变浏览器窗口大小时触发该事件。


20. onselect(ns3、4,ie3、4):选择文本框中的文本时触发该事件。


21. onstart(ie4):滚动文本条中的文本开始滚动时触发的事件。


22. onsubmit(ns3、4,ie3、4):提交表单时触发该事件。


23. onunload(ns3、4,ie3、4):从当前的网页退出时触发该事件。


 <HTML> <HEAD> <TITLE>本站</TITLE> </HEAD> <BODY BGCOLOR="#666666" LEFTMARGIN="0" TOPMARGIN="0" > <TABLE WIDTH="770" BORDER="0" CELLSPACING="0" CELLPADDING="4" ALIGN="center" BGCOLOR="#FFEFD6" CLASS="2line" BACKGROUND="../image/bg01.gif"> <TR> <TD> <DIV ALIGN="center" ID="pageTitle" CLASS="13px_font"> <B>javascript事件列表解说</B></DIV> </TD> </TR> <TR> <TD CLASS="13px_font"> <TABLE CELLSPACING="0" BORDERCOLORDARK="white" CELLPADDING="2" WIDTH="90%" ALIGN="center" BORDERCOLORLIGHT="black" BORDER="1"> <TR> <TD ALIGN="middle" COLSPAN="2">事件</TD> <TD ALIGN="middle" WIDTH="85">浏览器支持</TD> <TD ALIGN="middle" WIDTH="348">解说</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="10">一般事件</TD> <TD WIDTH="131">onclick</TD> <TD WIDTH="85">IE3、N2 </TD> <TD WIDTH="348">鼠标点击时触发此事件</TD> </TR> <TR> <TD WIDTH="131">ondblclick</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">鼠标双击时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onmousedown</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">按下鼠标时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onmouseup</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">鼠标按下后松开鼠标时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onmouseover</TD> <TD WIDTH="85">IE3、N2 </TD> <TD WIDTH="348">当鼠标移动到某对象范围的上方时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onmousemove</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">鼠标移动时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onmouseout</TD> <TD WIDTH="85">IE4、N3</TD> <TD WIDTH="348">当鼠标离开某对象范围时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onkeypress</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">当键盘上的某个键被按下并且释放时触发此事件.</TD> </TR> <TR> <TD WIDTH="131">onkeydown</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">当键盘上某个按键被按下时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onkeyup</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">当键盘上某个按键被按放开时触发此事件</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="9">页面相关事件</TD> <TD WIDTH="131">onabort</TD> <TD WIDTH="85">IE4、N3 </TD> <TD WIDTH="348">图片在下载时被用户中断</TD> </TR> <TR> <TD WIDTH="131">onbeforeunload</TD> <TD WIDTH="85">IE4、N </TD> <TD WIDTH="348">当前页面的内容将要被改变时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onerror</TD> <TD WIDTH="85">IE4、N3 </TD> <TD WIDTH="348">出现错误时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onload</TD> <TD WIDTH="85">IE3、N2 </TD> <TD WIDTH="348">页面内容完成时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onmove</TD> <TD WIDTH="85">IE、N4 </TD> <TD WIDTH="348">浏览器的窗口被移动时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onresize</TD> <TD WIDTH="85">IE4、N4 </TD> <TD WIDTH="348">当浏览器的窗口大小被改变时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onscroll</TD> <TD WIDTH="85">IE4、N </TD> <TD WIDTH="348">浏览器的滚动条位置发生变化时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onstop</TD> <TD WIDTH="85">IE5、N </TD> <TD WIDTH="348">浏览器的停止按钮被按下时触发此事件或者正在下载的文件被中断</TD> </TR> <TR> <TD WIDTH="131">onunload</TD> <TD WIDTH="85">IE3、N2 </TD> <TD WIDTH="348">当前页面将被改变时触发此事件</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="5">表单相关事件</TD> <TD WIDTH="131">onblur</TD> <TD WIDTH="85">IE3、N2 </TD> <TD WIDTH="348">当前元素失去焦点时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onchange</TD> <TD WIDTH="85">IE3、N2 </TD> <TD WIDTH="348">当前元素失去焦点并且元素的内容发生改变而触发此事件</TD> </TR> <TR> <TD WIDTH="131">onfocus</TD> <TD WIDTH="85">IE3 、N2</TD> <TD WIDTH="348">当某个元素获得焦点时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onreset</TD> <TD WIDTH="85">IE4 、N3 </TD> <TD WIDTH="348">当表单中RESET的属性被激发时触发此事件</TD> </TR> <TR> <TD WIDTH="131">onsubmit</TD> <TD WIDTH="85">IE3 、N2 </TD> <TD WIDTH="348">一个表单被递交时触发此事件</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="3">滚动字幕事件</TD> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbounce</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">在Marquee内的内容移动至Marquee显示范围之外时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onfinish</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当Marquee元素完成需要显示的内容后触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onstart</TD> <TD VALIGN="top" WIDTH="85">IE4、 N</TD> <TD WIDTH="348">当Marquee元素开始显示内容时触发此事件</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="20">编辑事件</TD> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbeforecopy</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbeforecut</TD> <TD VALIGN="top" WIDTH="85">IE5、 N</TD> <TD WIDTH="348">当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbeforeeditfocus</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当前元素将要进入编辑状态</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbeforepaste</TD> <TD VALIGN="top" WIDTH="85">IE5、 N</TD> <TD WIDTH="348">内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbeforeupdate</TD> <TD VALIGN="top" WIDTH="85">IE5、 N</TD> <TD WIDTH="348">当浏览者粘贴系统剪贴板中的内容时通知目标对象</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">oncontextmenu</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">oncopy</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当页面当前的被选择内容被复制后触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">oncut</TD> <TD VALIGN="top" WIDTH="85">IE5、N </TD> <TD WIDTH="348">当页面当前的被选择内容被剪切时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondrag</TD> <TD VALIGN="top" WIDTH="85">IE5、N </TD> <TD WIDTH="348">当某个对象被拖动时触发此事件 [活动事件]</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondragdrop</TD> <TD VALIGN="top" WIDTH="85">IE、N4</TD> <TD WIDTH="348">一个外部对象被鼠标拖进当前窗口或者帧</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondragend</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当鼠标拖动结束时触发此事件,即鼠标的按钮被释放了</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondragenter</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当对象被鼠标拖动的对象进入其容器范围内时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondragleave</TD> <TD VALIGN="top" WIDTH="85">IE5、N </TD> <TD WIDTH="348">当对象被鼠标拖动的对象离开其容器范围内时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondragover</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当某被拖动的对象在另一对象容器范围内拖动时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondragstart</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当某对象将被拖动时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondrop</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">在一个拖动过程中,释放鼠标键时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onlosecapture</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当元素失去鼠标移动所形成的选择焦点时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onpaste</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当内容被粘贴时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onselect </TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当文本内容被选择时的事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onselectstart</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当文本内容选择将开始发生时触发的事件</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="10">数据绑定</TD> <TD VALIGN="top" ALIGN="left" WIDTH="131">onafterupdate</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当数据完成由数据源到对象的传送时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">oncellchange</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当数据来源发生变化时</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondataavailable</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当数据接收完成时触发事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">ondatasetchanged</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">数据在数据源发生变化时触发的事件</TD> </TR> <TR> <TD WIDTH="131">ondatasetcomplete</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当来子数据源的全部有效数据读取完毕时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onerrorupdate</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当使用onBeforeUpdate事件触发取消了数据传送时,代替onAfterUpdate事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onrowenter</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当前数据源的数据发生变化并且有新的有效数据时触发的事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onrowexit</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当前数据源的数据将要发生变化时触发的事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onrowsdelete</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当前数据记录将被删除时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onrowsinserted</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当前数据源将要插入新数据记录时触发此事件</TD> </TR> <TR> <TD WIDTH="12" ROWSPAN="6">外部事件</TD> <TD VALIGN="top" ALIGN="left" WIDTH="131">onafterprint</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当文档被打印后触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onbeforeprint</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当文档即将打印时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onfilterchange</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当某个对象的滤镜效果发生变化时触发的事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onhelp</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当浏览者按下F1或者浏览器的帮助选择时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onpropertychange</TD> <TD VALIGN="top" WIDTH="85">IE5、N</TD> <TD WIDTH="348">当对象的属性之一发生变化时触发此事件</TD> </TR> <TR> <TD VALIGN="top" ALIGN="left" WIDTH="131">onreadystatechange</TD> <TD VALIGN="top" WIDTH="85">IE4、N</TD> <TD WIDTH="348">当对象的初始化属性值发生变化时触发此事件</TD> </TR> </TABLE> </TR> </TABLE> </BODY> </HTML> 

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

作者最新文章