js高階 12 jquery事件彙總

2021-09-08 22:58:19 字數 2825 閱讀 1796

keypress事件只在按下鍵盤的任一「字元鍵」(如a~z、數字鍵)時觸發,單獨按下「功能鍵」(如f1~f12、ctrl鍵、shift鍵、alt鍵等)不會觸發;而keydown無論是按下「字元鍵」還是「功能鍵」都會觸發;

event.which 指示按了哪個鍵或按鈕。

event.type 描述事件的型別。

event.target 觸發該事件的 dom 元素。

event.currenttarget 在事件冒泡階段中的當前dom元素,等同於'this'

event.relatedtarget 返回當滑鼠移動時進入或退出的那個元素

event.data 事件呼叫時的額外資料

event.pagex/event.pagey 顯示滑鼠相對於檔案的左側和頂部邊緣的位置 注意區分:screenx/screeny:獲取顯示器螢幕位置的座標;

clientx/clienty:獲取相對於頁面視口的座標

event.result這個屬性包含了當前事件事件最後觸發的那個處理函式的返回值 如果為dom元素的同一事件型別繫結了多個事件處理函式,你可以使用result屬性獲取上乙個事件處理函式執行的返回值。

event.timestamp 屬性用於返回當前事件觸發的時間值。這個時間值是距離2023年1月1日的毫秒數。

event.which 針對鍵盤和滑鼠事件,這個屬效能確定你到底按的是哪個鍵或按鈕。 event.which 將 event.keycode 和 event.charcode 標準化了。推薦用 event.which 來監視鍵盤輸入。

在mousedownmouseup事件中,event.which屬性返回的是對應滑鼠按鈕的對映**值(相當於event.button)。以下是主要的滑鼠按鈕對映**對應表。

event.which屬性值

對應的滑鼠按鈕

1滑鼠左鍵

2滑鼠中鍵(滾輪鍵)

3滑鼠右鍵

在keydownkeyup事件中,event.which屬性返回的是對應按鍵的對映**值(相當於event.keycode)。以下是常用的鍵盤按鍵對映**的對應表:

which屬性值(或範圍)

對應的輸入字元

48 - 57

對應字元 0 - 9

65 - 90

對應字元 a - z

97 - 122

對應字元 a - z

which屬性值(或範圍)

對應的鍵盤按鍵

8backspace鍵

9tab鍵

13enter鍵

16shift鍵

17ctrl鍵

20alt鍵

20caps lock鍵(大小寫鎖定)

27esc鍵

33 - 36

對應按鍵 pageup、pagedown、end、home

37 - 40

對應按鍵 左、上、右、下(方向鍵)

45 - 46

對應按鍵 insert、delete

48 - 57

對應按鍵 0 - 9(非小鍵盤)

65 - 90

對應按鍵 a - z

91windows鍵

96 - 105

對應按鍵 0 - 9(小鍵盤)

106、107、109、110、111

對應按鍵*、+、-、.、/(小鍵盤)

112 - 123

對應按鍵 f1 - f12

event.preventdefault() 阻止事件的預設動作。

event.isdefaultprevented() 返回 event 物件上是否呼叫了 event.preventdefault()。

event.stoppropagation() 防止事件冒泡

event.ispropagationstopped()判斷是否呼叫過 event.stoppropagation() 方法

event.stopimmediatepropagation() 阻止剩餘的事件處理函式執行並且防止事件冒泡

event.isimmediatepropagationstopped() 檢測 event.stopimmediatepropagation() 是否被呼叫過。

事件繫結

on() 為某些元素繫結乙個事件或者多個事件。 該函式可以為同一元素、同一事件型別繫結多個事件處理函式。觸發事件時,jquery會按照繫結的先後順序依次執行繫結的事件處理函式。

事件解綁

off() 解除繫結的某一指定的事件或者所有事件。 「繫結」與「解綁」是相反的關係。在jquery中,我們可以通過off()方法解除繫結的某一指定的事件或者所有事件。

對同一元素繫結的多個同一事件進行解綁,可以使用命名空間解決,例如『click.a』『click.b』

事件委託

通過事件冒泡,讓子元素繫結的事件冒泡到父元素(或祖先元素)上,然後再進行處理。

one()為每乙個匹配元素的特定事件繫結乙個一次性的事件處理函式。 通過one()函式繫結的事件處理函式都是一次性的,只有首次觸發事件時會執行該事件處理函式。觸發之後,jquery就會移除當前事件繫結。

trigger() 在每乙個匹配的元素上觸發某類事件。

triggerhandler() 觸發被選元素的指定事件型別。但不會執行瀏覽器預設動作,也不會產生事件冒泡。 與trigger()區別

triggerhandler()不會引起事件的預設行為

trigger() 會操作匹配的所有元素,而triggerhandler() 只影響第乙個匹配元素。

triggerhandler() 建立的事件不會產生事件冒泡.

triggerhandler()返回的是事件處理函式的返回值,而不是具有可鏈性的 jquery 物件。如果沒有處理程式被觸發,則這個方法返回 undefined。

jQuery 高階事件 委託

function 使用live繫結的是document,而非button 所以,永遠只會繫結一次事件 button live click function bind 無法動態繫結事件 button bind click function live 可以動態繫結事件,因為事件繫結在document上 ...

事件 《JS高階程式設計》

一 事件流 1.事件流描述的是從頁面中接收事件的順序 2.事件冒泡 event bubble 事件從開始時由最具體的元素 就是巢狀最深的那個節點 開始,逐級向上傳播到較為不具體的節點 就是document 點選這裡 如果點選了div元素,那麼這個click事件會按如下順序傳播 1.2.3.4.doc...

JS框架 JQuery高階

1.jquery 高階 1.動畫 2.遍歷 3.事件繫結 4.案例 5.外掛程式 1.動畫 1.三種方式顯示和隱藏元素 1.預設顯示和隱藏方式 1.show speed,easing fn 1.引數 1.speed 動畫的速度。三個預定義的值 slow normal fast 或表示動畫時長的毫秒數...