jQuery中的Event對象

來源:互聯網
上載者:User

jQuery中的事件

1、瀏覽器實現的事件模型
DOM Level 0事件處理的實現是將一個handler賦值給元素的屬性,如onclick=function(param1, param2){...}。
缺點是一個事件只能有一個處理函數,即最後一個被賦值的處理函數,之前的全部被覆蓋

DOM Level 2事件處理的實現是使用方法addEventListener(eventType, listener, useCapture)
eventType是去掉之前元素屬性的"on"首碼,即onclick的eventType是click
listener是事件處理函數的引用,第一個參數是event對象
useCapture是指使用捕捉或冒泡方式處理事件,一般為false,即使用冒泡方式
但是IE沒有實現DOM Level 2的事件處理模型,不支援捕捉方式,而且使用方法也不同
attachEvent(eventName,handler)
handler沒有將event對象作為第一個參數傳入,而是使用window.event

2、用JQuery綁定事件處理到元素
bind(eventType,data,listener)    綁定事件到JQuery對象
eventType:事件類型
data:Object類型,用於listener中使用的資料,可省略
listener:處理函數

還可以對事件進行組合,使用namespace的方式
例如:click.myNamespace,這樣可以將幾個事件處理作為一個單元處理

eventTypeName(listener)   
eventTypeName是指:
blur
change
click
dblclick
error
focus
keydown
keypress
keyup
load
mousedown
mousemove
mouseout
mouseover
mouseup
resize
scroll
select
submit
unload

結果返回封裝集

one(eventType,data,listener)    只執行一次綁定的函數
unbind(eventType,listener)    若沒有參數則所有的listener都被移除
unbind(event)

3、Event對象執行個體

Event執行個體屬性

altKey
Set to true if the Alt key was pressed when the event was triggered, false if not. The Alt key is labeled Option on most Mac keyboards.
ctrlKey
Set to true if the Ctrl key was pressed when the event was triggered, false if not. data The value, if any, passed as the second parameter to the bind() command when the handler was established.
keyCode
For keyup and keydown events, this returns the key that was pressed. Note that for alphabetic characters, the uppercase version of the letter will be returned, regardless of whether the user typed an uppercase or lowercase letter. For example, both a and A will return 65. You can use shiftKey to determine which case was entered. For keypress events, use the which property, which is reliable across browsers.
metaKey
Set to true if the Meta key was pressed when the event was triggered, false if not The Meta key is the Ctrl key on PCs and the Command key on Macs.
pageX
For mouse events, specifies the horizontal coordinate of the event relative from the page origin.
pageY
For mouse events, specifies the vertical coordinate of the event relative from the page origin.
relatedTarget
For some mouse events, identifies the element that the cursor left or entered when the event was triggered.
screenX
For mouse events, specifies the horizontal coordinate of the event relative from the screen origin.
screenY
For mouse events, specifies the vertical coordinate of the event relative from the screen origin.
shiftKey
Set to true if the Shift key was pressed when the event was triggered, false if not.
target
Identifies the element for which the event was triggered.
type
For all events, specifies the type of event that was triggered (for example, click). This can be useful if you’re using one event handler function for multiple events.
which
For keyboard events, specifies the numeric code for the key that caused the event, and for mouse events, specifies which button was pressed (1 for left, 2 for middle, 3 for right). This should be used instead of button, which can’t be relied on to function consistently across browsers.

stopPropagation()
preventDefault()

4、用指令碼觸發事件處理
trigger(eventType)    由於事件觸發是從代碼產生的,所以沒有Event執行個體,也沒有冒泡
eventName()
blur
click
focus
select
submit

toggle(listenerOdd,listenerEven)
listenerOdd    第1、3……次執行的函數
listenerEven    第2、4……次執行的函數

hover(overListener,outListener)

博文來源:http://www.cnblogs.com/everx/archive/2008/02/21/1076458.html

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.