JS的事件物件

2022-09-02 03:51:15 字數 1721 閱讀 6883

一、什麼是事件物件(黑匣子)

(一)事件:

onclick

ondblclick

(二)當繫結物件的事件被觸發時,所發生的所有詳細資訊都會儲存在乙個地方,這個地方稱為事件物件

二、如何獲取事件物件

(一)標準瀏覽器:給事件觸發函式傳遞的第乙個引數;

(二)ie瀏覽器:全域性物件的屬性window.event;

(三)相容:evt = evt || window.event

var e = evt ||window.event

三、如何獲取滑鼠的編碼值

(一)event.button

標準瀏覽器:左鍵:0;滾輪鍵:1;右鍵:2

ie9以下:左鍵:1;滾輪鍵:4;右鍵:2

相容:function getbutton(evt)else if(window.event){

switch(e.button){

case 1:return 0;

case 2:return 1;

case 3:return 2;

四、如何獲取滑鼠的座標值

(一)相對座標值:event.offsetx  event.offsety;相對滑鼠所在物件上的座標值

(二)絕對座標值(頁面座標值):event.pagex  event.pagey;滑鼠到頁面的座標值

(三)可視區座標值:event.clientx  event.clienty;滑鼠到頁面中可視區域的座標值

(四)螢幕座標值:event.screenx  event.screeny;滑鼠到電腦螢幕的座標值

思考:如何實現滑鼠跟隨效果

五、什麼是事件流,什麼是事件冒泡

(一)事件流:指事件的流向,有三個階段:事件捕獲/事件目標/事件冒泡

(二)事件捕獲:由外而內,由祖先元素向子孫元素一次傳遞事件的過程

(三)事件冒泡:由內而外,由子孫元素向祖先元素一次傳遞事件的過程

注:瀏覽器預設開啟的是事件冒泡,ie與歐朋瀏覽器不支援事件捕獲

(四)如何阻止事件冒泡

1.標準瀏覽器:event.stoppropagation()

2.ie:eventcancelbubble = true;

相容:event.stoppropagation ? event.stoppropagation() : event.cancelbubble = true;

六、如何獲取鍵盤的編碼值

(一)event.keycode event.charcode event.which

onkeydown/onkeyup : 監聽是整個鍵盤.

event.keycode : 獲取整個鍵盤的編碼值,字母只獲取大寫的編碼值.,

onkeypress : 監聽除功能鍵外的鍵盤值

相容 : event.keycode || event.charcode || event.which

火狐:event.keycode : 0,

event.charcode : 大小寫字母的編碼值,

event.which : 大小寫字母的編碼值,

谷歌:event.keycode : 大小寫字母的編碼值,

event.charcode : 大小寫字母的編碼值,

event.which : 大小寫字母的編碼值,

七、如何設定組合鍵(快捷鍵)

(一)event.ctrlkey

(二)event.shiftkey

(三)event.altkey

JS 事件物件

在觸發dom上的某個事件時,會產生乙個事件物件event。這個物件中包含著所有與事件有關的資訊。包括導致事件的元素,事件的型別以及其他與特定事件相關的資訊。所有瀏覽器都支援event物件,event物件會傳入dom0級,dom2級,html指定,的事件處理程式中,但支援的方式不同,所以也會涉及跨瀏覽...

JS事件物件

1.什麼是事件物件 官方解釋 event 物件代表事件的狀態,比如鍵盤按鍵的狀態 滑鼠的位置 滑鼠按鈕的狀態。比如 誰繫結了這個事件。滑鼠觸發事件的話,會得到滑鼠的相關資訊,如滑鼠位置。鍵盤觸發事件的話,會得到鍵盤的相關資訊,如按了哪個鍵。2.事件物件的使用 事件觸發發生時就會產生事件物件,並且系統...

js 事件物件

事件繫結的格式 元素節點.on 事件型別 function 就是乙個事件物件 obtn 也是乙個物件,所以我們把上面中的.onclick function 看作是 obtn物件的乙個方法 函式 我們把這個事件函式寫在這以後,什麼事件呼叫的呢?我們都知道,只有按鈕被點選時才會呼叫這個事件函式,所以這個...