讀jQuery之十 事件模組概述

來源:互聯網
上載者:User

後面會詳細分析jQuery.event.add/jQuery.event.remove/jQuery.event.trigger。

雖然事件模組代碼很難讀,但其提供的API介面還是很清晰的。如下

1 添加事件(bind/one/live/delegate/hover/toggle)
bind 基本的添加事件函數。
one 添加只執行一次的事件函數。
live 事件代理(使用document代理)。
delegate 事件代理(使用指定元素代理)。
hover 類比css的hover。
toggle 顯示/隱藏。

bind/one/live 都是使用內部的jQuery.event.add 來完成事件添加。
delegate 內部調用的是live。
hover 內部使用mouseenter/mouseleave,而mouseenter/mouseleave又使用bind。
toggle 內部使用click,而click內部又調用的是bind。

實際上jQuery的一個each調用就給jQuery對象上增加了24個添加事件的快捷方法


記住,bind調用的是jQuery.event.add,因此 jQuery.event.add 才是整個jQuery添加事件模組的核心。以上所有的方法都是在其之上構建的上層應用。


2 刪除事件 (unbind/die/undelegate)

unbind 刪除事件基礎方法。可以刪除一個指定handler,還可以刪除某類型事件的全部handler,甚至可以刪除掛在element上的全部事件。其內部調用jQuery.event.remove。

die/undelegate 刪除事件代理。 內部都使用unbind。


因此, jQuery.event.remove 才是整個jQuery刪除事件模組的核心。unbind/die/undelegate都是在其之上構建的上層應用。


3 觸發事件(trigger/triggerHandler)

trigger 觸發一個事件(會冒泡)

triggerHandler 觸發一個事件(不會冒泡)


trigger/triggerHandler 內部調用的都是jQuery.event.trigger,因此jQuery.event.trigger 才是整個jQuery觸發事件模組的核心。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.