事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。
JavaScript程序采用了异步事件驱动编程(Event-driven programming)模型,维基百科对它的解释是:
事件驱动程序设计(Event-driven programming)是一种电脑程序设计模型。这种模型的程序运行流程是由用户的动作(如鼠标的按键,键盘的按键动作)或者是由其他程序的消息来决定的。
相对于批处理程序设计(batch programming)而言,程序运行的流程是由程序员来决定。批量的程序设计在初级程序设计教学课程上是一种方式。然而,事件驱动程序设计这种设计模型是在交互程序(Interactive program)的情况下孕育而生的。
由于用户的行为是不确定的。这种场景是传统的同步编程模型没法解决的,因为你不可能等用户操作完了才执行后面的代码。所以在javascript中使用了异步事件,也就是说:js中的事件都是异步执行的。
事件驱动程序模型基本的实现原理基本上都是使用 事件循环(Event Loop),这部分内容涉及浏览器事件模型、回调原理。
JavaScript DOM、BOM模型中,同样异步的还有setTimeout,XMLHTTPRequest这类API并不是JavaScript语言本身就有的。
事件分类:
onload 和 onUnload事件
当用户进入或离开页面时就会触发 onload 和 onUnload 事件。
onload 事件常用来检测访问者的浏览器类型和版本,然后根据这些信息载入特定版本的网页。
onload 和 onUnload 事件也常被用来处理用户进入或离开页面时所建立的 cookies。
onFocus, onBlur 和 onChange事件
onFocus、onBlur 和 onChange 事件通常相互配合用来验证表单。
下面是一个使用 onChange 事件的例子。用户一旦改变了域的内容,checkEmail() 函数就会被调用。
onSubmit事件
onSubmit 用于在提交表单之前验证所有的表单域。
下面是一个使用 onSubmit 事件的例子。当用户单击表单中的确认按钮时,checkForm() 函数就会被调用。假若域的值无效,此次提交就会被取消。checkForm() 函数的返回值是 true 或者 false。如果返回值为true,则提交表单,反之取消提交。
onMouseOver 和 onMouseOut事件
onMouseOver 和 onMouseOut 用来创建“动态的”按钮。
下面是一个使用 onMouseOver 事件的例子。当 onMouseOver 事件被脚本侦测到时,就会弹出一个警告框: