JavaScript事件 javascript事件|JavaScript

本文概要

鼠标事件
键盘事件
表单事件
窗口/文档事件
点击事件
鼠标悬停事件
焦点事件
keydown事件
Load事件

【JavaScript事件】中的对象的状态的变化被称为一个事件。在HTML中，有其表示一些活动由用户或由浏览器执行的各种事件。当JavaScript代码被包含在HTML，JS对这些事件作出反应，并允许执行。在事件反应的这一过程被称为事件处理。因此，JS处理通过事件处理程序的HTML事件。
例如，当用户通过点击浏览器，对事件进行加载JS代码，将执行任务。
一些HTML事件及其事件处理程序是：
鼠标事件

演出活动	事件处理程序	描述
click	onclick	当一个元素上点击鼠标
mouseover	onmouseover	当鼠标的光标来在元件
mouseout	onmouseout	当鼠标的光标离开的元件
mousedown	onmousedown	当鼠标按钮被按下在元件
mouseup	onmouseup	当鼠标按钮被释放在元件
mousemove	onmousemove	当鼠标移动发生。

键盘事件

演出活动	事件处理程序	描述
Keydown & Keyup	onkeydown & onkeyup	当用户按下然后松开按键

表单事件

演出活动	事件处理程序	描述
focus	onfocus	当用户集中的元件上
submit	onsubmit	当用户提交表单
blur	onblur	当焦点远离形式元件
change	onchange	当用户修改或改变形式元素的值

窗口/文档事件

演出活动	事件处理程序	描述
load	onload	当浏览器完成页面加载
unload	onunload	当访问者离开当前的网页，浏览器卸载它
resize	onresize	当访问者调整大小的浏览器窗口

让我们讨论了事件及其处理程序的一些例子。
点击事件

< html> < head> Javascript Events < /head> < body> < script language="Javascript" type="text/Javascript"> < !-- function clickevent() { document.write("This is srcmini"); } //--> < /script> < form> < input type="button" onclick="clickevent()" value="http://www.srcmini.com/Who's this?"/> < /form> < /body> < /html>

鼠标悬停事件

< html> < head> < h1> Javascript Events < /h1> < /head> < body> < script language="Javascript" type="text/Javascript"> < !-- function mouseoverevent() { alert("This is srcmini"); } //--> < /script> < p onmouseover="mouseoverevent()"> Keep cursor over me< /p> < /body> < /html>

焦点事件

< html> < head> Javascript Events< /head> < body> < h2> Enter something here< /h2> < input type="text" id="input1" onfocus="focusevent()"/> < script> < !-- function focusevent() { document.getElementById("input1").style.background=" aqua"; } //--> < /script> < /body> < /html>

keydown事件

< html> < head> Javascript Events< /head> < body> < h2> Enter something here< /h2> < input type="text" id="input1" onkeydown="keydownevent()"/> < script> < !-- function keydownevent() { document.getElementById("input1"); alert("Pressed a key"); } //--> < /script> < /body> < /html>

Load事件

< html> < head>Javascript Events< /head> < /br> < body onload="window.alert('Page successfully loaded'); "> < script> < !-- document.write("The page is loaded successfully"); //--> < /script> < /body> < /html>