承前文,在事件的注册/绑定与监听中,入门者最常使用「监听CLICK事件」等侵入/非侵入式JavaScript。然而,这只是有关事件的冰山一角。兹分述如下。
网页界面事件
此类事件可以与DOM、BOM两类操作有关,包括有:
- DOMContentLoaded事件:待网页DOM结构载入後,开始触发。
- load事件:待网页资源(包括外部资源)全部载入,开始触发(如图片、CSS载入完毕後,所以比DOMContentLoaded事件要慢)。
- unload或beforeunload事件:待离开网页/重新载入网页,开始触发(如跳出讯息「是否要离开?」)。
- error事件:图片或document载入错误时,开始触发(写为 onerrer="触发行为")。
- resize事件:浏览器视窗或元素的尺寸变更时,开始触发。
- fullscreenchange事件:浏览器视窗切换全萤幕/切换复原时,开始触发。
- scroll事件:浏览器视窗或元素的卷轴拉动时,开始触发。
滑鼠触发事件
- mousedown或mouseup事件:滑鼠指标「点下」、「放开」某元素时,开始触发。
- click事件:滑鼠指标「点下」某元素时,开始触发。
- dblclick事件:滑鼠指标「连点两下」某元素时,开始触发。
- mouseenter或mousemove或mouseleave或mouseover事件:滑鼠指标移入、移动、离开某元素时,依次触发。
键盘触发事件
键盘事件常注册在网页中的input标单框:
- keydown事件:键盘「按下」时,开始触发。
- keypress事件:除了Shift、Fn、CapsLock之外,键盘「按下」时,开始触发。「一直按下」则连续触发。
- keyup事件:键盘「放开」时,开始触发。
表单触发事件
顾名思义,本类事件与表单元素相关,处理与input、select、textarea有关的事件。
- input事件:凡带有contenteditable元素及input与textarea框内内容改变时,开始触发。
- select事件:凡在input与textarea框内选取文字,即可被event.target的selectionEnd与selectionStart取得。
- change事件:凡触发若干表单元素时,且离输入框之後,开始触发。
- submit事件:凡form表单资料送出时(包括表单验证),开始触发。
- reset事件:凡form表单资料重置时,开始触发。
- focus事件:凡表单元素聚焦时,开始触发。
- blur事件:凡表单元素失焦时,开始触发。
特殊事件
组成事件包含三种可监听事件:
- compositionstart:在框内启动输入法且正在拼字,开始触发。
- compositionupdate:在框内启动输入法且正在拼字/选字,开始触发。
- compositionend:在框内启动输入法且拼字/选字完成,开始触发。
剪贴簿事件,包括操作电脑常用的:
- cut事件:在网页中选取且剪下文字时,开始触发。
- copy事件:在网页中选取且复制文字时,开始触发。
- paste事件:将剪贴簿中的文字贴上时,开始触发。
阻挡事件
为了特殊设计需求,有时候必须阻挡HTML元素的预设行为(如超连结、表单送出等)。此时,可以在指定榜定行为前面,加上 event.preventDefault() 方法,阻挡预设事件。
此外,如须阻止事件向上冒泡传递(如同一事件执行两次),亦可使用 **event.stopPropogation() ** 方法加以实施。