1.事件概述
JavaScript与Web页面之间的交互时通过用户操作浏览器页面时触发相关事件来实现的。例如:
在页面载入完毕时,将处罚load(载入)事件;
当用户单击按钮时,将触发按钮的click事件等。
用户响应某个事件而执行的处理程序称为事件处理程序。例如:
当用户单击按钮时,将触发按钮的事件处理程序onClick。
事件处理程序的两种分配方式
(1)在JavaScript中分配事件处理程序
例:
<img src="http://gi3.md.alicdn.com/bao/uploaded/i3/TB1tlxaHpXXXXXtaXXXXXXXXXXX_!!0-item_pic.jpg_430x430q90.jpg" id="aimage">
<script language="javascript">
var img = document.getElementById("aimage");
img.onclick = function() {
alert('单击了图片');
}
</script>
在页面中加入上面的代码并运行,则当单击图片aimage时,将弹出“单击了图片”对话框。
在JavaScript中分配时间处理程序时,事件处理程序名称必须小写,才能正确响应事件。
(2)在HTML中分配事件处理程序
例:
<img src="http://gi3.md.alicdn.com/bao/uploaded/i3/TB1tlxaHpXXXXXtaXXXXXXXXXXX_!!0-item_pic.jpg_430x430q90.jpg" onclick="alert('单击了图片');">
2.事件类型
UI事件:如load、unload、error、resize、scroll、select、DOMActive,是用户与页面上的元素交互时触发的。
焦点事件:如blur、DOMFocusIn、DOMFocusOut、focus、focusin、focusout,在元素获得或失去焦点的时候触发,这些事件当中,最为重要的是blur和focus,有一点需要引起注意,这一类事件不会发生冒泡!
鼠标与滚轮事件:如click、dblclick、mousedown、mouseenter、mouseleave、mousemove、mouseout、mouseover、mouseup,是当用户通过鼠标在页面执行操作时所触发的。
滚轮事件:mousewheel(IE6+均支持)、DOMMouseScroll(FF支持的,与mousewheel效果一样)。是使用鼠标滚轮时触发的。
文本事件:textInput,在文档中输入文本触发。
键盘事件:keydown、keyup、keypress,当用户通过键盘在页面中执行操作时触发。
合成事件:DOM3级新增,用于处理IME的输入序列。所谓IME,指的是输入法编辑器,可以让用户输入在物理键盘上找不到的字符。compositionstart、compositionupdate、compositionend三种事件。
变动事件:DOMsubtreeModified、DOMNodeInserted、DOMNodeRemoved、DOMAttrModified、DOMCharacterDataModified等,当底层DOM结构发生变化时触发。IE8-不支持。
变动名称事件:指的是当元素或者属性名变动时触发,当前已经弃用!
对于事件的基本类型,随着HTML5的出现和发展,又新增了HTML5事件、设备事件、触摸事件、手势事件等各种事件。
posted on 2015-03-24 10:58
marchalex 阅读(193)
评论(0) 编辑 收藏 所属分类:
Java Web