JS事件型別詳解

2022-02-21 21:36:11 字數 3094 閱讀 7804

一般事件

onclick ie3、n2 滑鼠點選時觸發 此事件

ondblclick ie4、n4 滑鼠雙擊時觸發 此事件

onmousedown ie4、n4 按下滑鼠時觸發 此事件

onmouseup ie4、n4 滑鼠按下後鬆開滑鼠時觸發 此事件

onmouseover ie3、n2 當滑鼠移動到某物件範圍的上方時觸發 此事件

onmousemove ie4、n4 滑鼠移動時觸發 此事件

onmouseout ie4、n3 當滑鼠離開某物件範圍時觸發 此事件

onkeypress ie4、n4 當鍵盤上的某個鍵被按下並且釋放時觸發 此事件.

onkeydown ie4、n4 當鍵盤上某個按鍵被按下時觸發 此事件

onkeyup ie4、n4 當鍵盤上某個按鍵被按放開時觸發 此事件

頁面 相關事件

onbeforeunload ie4、n 當前頁面 的內容將要被改變時觸發 此事件

onerror ie4、n3 出現錯誤時觸發 此事件

onload ie3、n2 頁面 內容完成時觸發 此事件

onmove ie、n4 瀏覽器的視窗被移動時觸發 此事件

onresize ie4、n4 當瀏覽器的視窗大小被改變時觸發 此事件

onscroll ie4、n 瀏覽器的滾動條位置發生變化時觸發 此事件

onunload ie3、n2 當前頁面 將被改變時觸發 此事件

表單相關事件

onblur ie3、n2 當前元素失去焦點時觸發 此事件

onchange ie3、n2 當前元素失去焦點並且元素的內容發生改變而觸發 此事件

onfocus ie3 、n2 當某個元素獲得焦點時觸發 此事件

onreset ie4 、n3 當表單中reset的屬性被激發時觸發 此事件

js的event詳解(滑鼠的位置及狀態、按下的鍵)

event代表事件的狀態,例如觸發event物件的元素、滑鼠的位置及狀態、按下的鍵等等。

event物件只在事件發生的過程中才有效。

event的某些屬性只對特定的事件有意義。比如,fromelement 和 toelement 屬性只對 onmouseover 和 onmouseout 事件有意義。

例子下面的例子檢查滑鼠是否在鏈結上單擊,並且,如果shift鍵被按下,就取消鏈結的跳轉。

the event object property propertyname is

used here to return which property has been

altered.

value="click to change the value property of this button"

onpropertychange='alert(event.propertyname+" property has changed value")'>

onclick="changecssprop()"

value="click to change the css backgroundcolor property of this button"

onpropertychange='alert(event.propertyname+" property has changed value")'>

12.returnvalue

描述:設定或檢查從事件中返回的值

語法:event.returnvalue[ = boolean]

可能的值:

true 事件中的值被返回

false 源物件上事件的預設操作被取消

例子見本文的開頭。

13.screenx

描述:檢測滑鼠相對於使用者螢幕的水平位置

語法:event.screenx

注釋:這是個唯讀屬性。這意味著,你只能通過它來得到滑鼠的當前位置,卻不能用它來更改滑鼠的位置。

14.screeny

描述:檢測滑鼠相對於使用者螢幕的垂直位置

語法:event.screeny

注釋:這是個唯讀屬性。這意味著,你只能通過它來得到滑鼠的當前位置,卻不能用它來更改滑鼠的位置。

15.shiftkey

描述:檢查shift鍵的狀態。

語法:event.shiftkey

可能的值:

當shift鍵按下時,值為 true ,否則為 false 。唯讀。

16.srcelement

描述:返回觸發事件的元素。唯讀。例子見本文開頭。

語法:event.srcelement

17.srcfilter

描述:返回觸發 onfilterchange 事件的濾鏡。唯讀。

語法:event.srcfilter

18.toelement

描述:檢測 onmouseover 和 onmouseout 事件發生時,滑鼠所進入的元素。 參考:7.fromelement

語法:event.toelement

注釋:這是個唯讀屬性。

例子:下面的**演示了當滑鼠移到按鈕上時,彈出乙個對話方塊,顯示「mouse arrived」

code

mouse over this.

19.type

描述:返回事件名。

語法:event.type

注釋:返回沒有「on」作為字首的事件名,比如,onclick事件返回的type是click

唯讀。20. x

描述:返回滑鼠相對於css屬性中有position屬性的上級元素的x軸座標。如果沒有css屬性中有position屬性的上級元素,預設以body元素作為參考物件。

語法:event.x

注釋:如果事件觸發後,滑鼠移出視窗外,則返回的值為 -1

這是個唯讀屬性。這意味著,你只能通過它來得到滑鼠的當前位置,卻不能用它來更改滑鼠的位置。

21. y

描述:返回滑鼠相對於css屬性中有position屬性的上級元素的y軸座標。如果沒有css屬性中有position屬性的上級元素,預設以body元素作為參考物件。

語法:event.y

注釋:如果事件觸發後,滑鼠移出視窗外,則返回的值為 -1

這是個唯讀屬性。這意味著,你只能通過它來得到滑鼠的當前位置,卻不能用它來更改滑鼠的位置。

js事件委託詳解

首先說一下事件冒泡和事件捕獲機制,事件冒泡是有微軟公司提出來的,事件捕獲是有網景公司提出來的,當時兩家是爭論的不可開交,後來w3c也沒辦法,就採取了折中的方式,事件產生後先捕獲後冒泡,通常,在js中監聽事件的方法共有三種,分別是 ele.addeventlistener type,listener,...

js中的事件詳解

事件的3個階段 事件捕獲 目標階段 事件冒泡 事件冒泡和事件捕獲 事件捕獲 從document開始觸發,一級一級往下傳遞,依次觸發,直到真正事件目標為止 事件冒泡 從當前觸發的事件目標一級一級往上傳遞,依次觸發,直到document為止 事件 事件委託 利用事件冒泡,只用乙個事件處理程式,就可以管理...

JS滑鼠滾輪事件詳解

文章目錄 相容性寫法,該函式也是網上別人寫的,不過找不到出處了,蠻好的,所有我也沒有必要修改了 判斷滑鼠滾輪滾動方向 if window.addeventlistener ff,火狐瀏覽器會識別該方法 window.addeventlistener dommousescroll wheel,fals...