JavaScript笔记之处理事件

事件是用户在访问页面时执行的操作。当浏览器探测到一个事件时,比如鼠标点击或按键,它可以触发与这个事件相关联的JavaScript对象,这些对象称为事件处理程序(event handler)。

事件处理是一项重要的技术,而且它实际上包含了用户与页面的所有交互,接下来对如何使用事件处理程序来操作窗口、捕获鼠标移动和点击、处理表单事件以及在用户按下键盘键时作出响应做了一些简单的笔记。

专用事件
onload事件:浏览器装载完整个网页之后发生
onunload事件:浏览器窗口卸载完网页文档之后的事件
onbeforeunload:浏览器窗口卸载完网页文档之前的事件
通用事件
onclick事件
onmousemove事件
onmouseover事件
onmouseout事件
onmousedown事件
onmouseup事件
onkeydown事件
onkeyup事件
onkeypress事件:用户按下数字或字母键,按下并弹起两个步骤

(一)窗口事件处理

当用户执行某些会影响整个浏览器窗口操作时,就会发生窗口事件。最常见的窗口事件是通过大考某个页面来加载窗口。还有在窗口关闭、移动或转移到后台时触发事件处理程序的事件。

在使用事件处理程序时,常常会使用点号语法将事件处理程序与一个对象连接起来,如下:

window.onfocus

window.onload

document.onmousedown、注意:事件处理程序名称是小写的。

主要事件:

onload事件:当用户进入页面而且所有页面元素都完成加载时,就会触发这个事件。

onunload事件:当用户离开时,触发此事件处理程序

onresize事件

onmove事件:当窗口移动时

onabort事件:当用户取消网页上的图像加载时,会触发onabort事件处理程序。这种事件不太常用,且并非所有的浏览器都支持。

onerror事件

onfocus事件:当一个页面成为最前面的活动窗口时,就会触发onfocus处理程序。

onblur事件:与onfocus处理程序正好相反,如果希望一个窗口总是出现在所有其他窗口前面(例如,一个控制主页面内容的控制面板)。

(二)鼠标事件处理

用户与页面的许多交互都是通过鼠标移动或鼠标点击进行的。JavaScript为这些事件提供了一组强大的处理程序。

主要事件:

onclick: 点击鼠标左键时发生(右键不发生).当焦点在按钮上,并按了回车同样会发生.
ondblclick: 双击鼠标时发生(右键不发生)
onmousedown: 点击任意一个鼠标按钮时发生
onmouseout: 鼠标指针在某个元素上,且用户正要将其移出元素的边界时发生
onmouseover: 鼠标移出某个元素,到另一个元素上时发生
onmouseup: 松开任意一个按钮时发生
onmousemove: 鼠标在某个元素上持续发生

(三)表单事件处理

表单事件处理主要用来验证表单。通过使用下面列出的事件,可以处理用户在表单上所做的任何操作。

onsubmit:当用户点击Submit按钮来提交表单时,就会触发onsubmit处理程序。另外根据浏览器的不同,当用户退出表单上的最后一个文本输入字段时,也可能会触发它。

onreset:当用户点击表单上的Reset按钮(如果哟这个按钮的话)时,就会触发onreset处理程序。

onchange:当用户修改表单字段时,就会触发onchange事件处理程序。这可以用来立即验证输入的信息,或者在用户点击Submit按钮之前对用户的选择做出响应。

onselect:如果用户选择了一份inoput或textarea表单区域中的文本,就会触发onselect处理程序。

onclick:

onblur:

onfocus:

(四)键事件处理

除了鼠标之外,另一种主要的输入设备是键盘。JavaScript也为处理键盘提供了一些事件:

keydown: 按下某个键时发生. 一直按着会不断触发(opera浏览器除外)
keypress: 按下一个键,并产生一个字符时发生.一直按下会持续发生
keyup:释放按键时发生

(源《JavaScript基础教程》)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值