2014-10-31 78 views
1
$(document).on({ 
    "mousewheel": scrollHandler, 
    "DOMMouseScroll": ("onmousewheel" in document) ? null : scrollHandler, // Firefox 
    "keydown": keyHandler, 
    "mousedown": function(e) { 
     if(e.button === 1) { 
     e.preventDefault(); 
     return false; 
     } 
    } 
    }); 

我知道這段代碼正在偵聽向下滾動,但我確定它是如何工作的。根據documentation for on()該函數接受參數.on(events [, selector ] [, data ], handler)。但是,在我提供的示例代碼中,在on()方法中存在散列。應該是哪個參數?jQuery:一次創建多個事件偵聽器?

這段代碼實質上是一次創建多個eventListeners還是有其他事情我不明白?

回答

2

在jQuery .on()方法的格式中,第一個參數是一個普通的javascript對象,其中對象的鍵是「事件名稱」,它們的值是在發生該類型事件時執行的函數。在您的示例中,如果檢測到mousewheel事件,則會調用名爲scrollHandler的函數。如果檢測到​​事件,則稱爲keyHandler的函數將被調用(等等)。

該技術僅僅是一個接一個地具有多個.on()聲明的快捷方式。

+0

很酷,謝謝。在這種情況下,你是否也可以解釋「(」文件中的onmousewheel「)是如何工作的? – 2014-10-31 00:28:30

+1

@ chopperdrawlion4對我的朋友很開心。這就是所謂的「三元」表達。首先是一個布爾表達式,然後是兩個值之間的「冒號」。如果布爾表達式爲真,則整個值爲value1,否則爲value2。實際上,這段代碼會問「如果我們在文檔對象中有一個名爲」onmousewheel「的屬性,那麼將DOMMouseScroll設置爲沒有處理程序,否則將DOMMouseScroll設置爲由名爲scrollHandler的函數處理。 – Kolban 2014-10-31 00:31:43

1

您使用對應於.onsecond主叫簽名:

.on(events [, selector ] [, data ]) 

events的描述是:

類型:PlainObject
其中字符串鍵表示一個或多個對象空格分隔的事件類型和可選的命名空間,並且這些值表示要爲事件調用的處理函數。