1.事件概述
JavaScript與Web頁(yè)面之間的交互時(shí)通過(guò)用戶操作瀏覽器頁(yè)面時(shí)觸發(fā)相關(guān)事件來(lái)實(shí)現(xiàn)的。例如：
在頁(yè)面載入完畢時(shí)，將處罰load（載入）事件；
當(dāng)用戶單擊按鈕時(shí)，將觸發(fā)按鈕的click事件等。
用戶響應(yīng)某個(gè)事件而執(zhí)行的處理程序稱為事件處理程序。例如：
當(dāng)用戶單擊按鈕時(shí)，將觸發(fā)按鈕的事件處理程序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>
在頁(yè)面中加入上面的代碼并運(yùn)行，則當(dāng)單擊圖片aimage時(shí)，將彈出“單擊了圖片”對(duì)話框。
在JavaScript中分配時(shí)間處理程序時(shí)，事件處理程序名稱必須小寫，才能正確響應(yīng)事件。
（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，是用戶與頁(yè)面上的元素交互時(shí)觸發(fā)的。
焦點(diǎn)事件：如blur、DOMFocusIn、DOMFocusOut、focus、focusin、focusout，在元素獲得或失去焦點(diǎn)的時(shí)候觸發(fā)，這些事件當(dāng)中，最為重要的是blur和focus，有一點(diǎn)需要引起注意，這一類事件不會(huì)發(fā)生冒泡！
鼠標(biāo)與滾輪事件：如click、dblclick、mousedown、mouseenter、mouseleave、mousemove、mouseout、mouseover、mouseup，是當(dāng)用戶通過(guò)鼠標(biāo)在頁(yè)面執(zhí)行操作時(shí)所觸發(fā)的。
滾輪事件：mousewheel（IE6+均支持）、DOMMouseScroll（FF支持的，與mousewheel效果一樣）。是使用鼠標(biāo)滾輪時(shí)觸發(fā)的。
文本事件：textInput，在文檔中輸入文本觸發(fā)。
鍵盤事件：keydown、keyup、keypress，當(dāng)用戶通過(guò)鍵盤在頁(yè)面中執(zhí)行操作時(shí)觸發(fā)。
合成事件：DOM3級(jí)新增，用于處理IME的輸入序列。所謂IME，指的是輸入法編輯器，可以讓用戶輸入在物理鍵盤上找不到的字符。compositionstart、compositionupdate、compositionend三種事件。
變動(dòng)事件：DOMsubtreeModified、DOMNodeInserted、DOMNodeRemoved、DOMAttrModified、DOMCharacterDataModified等，當(dāng)?shù)讓覦OM結(jié)構(gòu)發(fā)生變化時(shí)觸發(fā)。IE8-不支持。
變動(dòng)名稱事件：指的是當(dāng)元素或者屬性名變動(dòng)時(shí)觸發(fā)，當(dāng)前已經(jīng)棄用！
對(duì)于事件的基本類型，隨著HTML5的出現(xiàn)和發(fā)展，又新增了HTML5事件、設(shè)備事件、觸摸事件、手勢(shì)事件等各種事件。
posted on 2015-03-24 10:58
marchalex 閱讀(196)
評(píng)論(0) 編輯 收藏 所屬分類:
Java Web