2011-08-03 90 views
1

問題標題jQuery的事件處理程序是有點晦澀,所以讓我解釋一下。爲Javascript功能

一個需求量的也僅僅最近對我解釋說是我的項目中使用jQuery的。但是我們注意到,我的函數很好,只要包含一些jQuery就可以重用。

所以我探索事件偵聽器的世界首次(JS側不在HTML)

一個標準的jQuery onclick事件

referenceToElement.onclick = function() { alert('here'); }; 

有一兩件事我注意到的是,該功能實際上並沒有名字。有沒有做這樣的事情的任何清潔方式:

referenceToElement.onclick = myOldJavascriptFunction(); 

function myOldJavascriptFunction() 
{ 
    //blahblahblah 
} 

這是很好的做法還是有更好的方式來做到這一點。現在這個工作現在還能工作嗎?

回答

4

即使問題實際上是值得一downvote,因爲你可以輕鬆回答所有這些問題通過搜索,我會給你一個提示。

referenceToElement.onclick = function() { alert('here'); }; 

是肯定沒有的jQuery標準的事情。它是純粹的Javascript,將屬性添加到DOM引用,在這種情況下是匿名函數。但是,您現在基本上提出了兩個問題。

  • 我們可以給這個匿名函數一個名字嗎? => YES
  • 可以我們引用其被定義在別處的函數?=>是

給它一個名字,我們就可以創建一個命名函數表達式這樣

referenceToElement.onclick = function myFunctionName() { alert('here'); }; 

要引用一個函數,我們只是通過它的名字

referenceToElement.onclick = myOldJavascriptFunction; 

最後,添加相同事件偵聽器的jQuery語法如下所示:

$(referenceToElement).click(myOldJavascriptFunction); 
+0

我確實看過。大多數事件監聽器的例子或者在html中定義它作爲onclick,或者手動定義這個函數作爲代碼顯示的第二個代碼片段。我絆倒的地方實際上是括號。如果你仍然認爲它值得一試,然後繼續。 – OVERTONE

+0

+1的解釋。另外,*命名的函數表達式*在IE8和IE8中的工作方式並不合適。 –

+0

@OVERTUNE:我只是在說一個簡單的搜索,沒有冒犯性! – jAndy

1

是的,你是非常接近正確的:

referenceToElement.onclick = myOldJavascriptFunction; 

注意缺少括號。這將對函數的引用傳遞給onclick事件。另外請注意,這是普通的舊JavaScript,而不是jQuery。這樣做的jQuery方式更像:

$(referenceToElement).click(myOldJavascriptFunction); 
1

你的第一個例子是普通的javascript,與jQuery完全無關。如果你使用jQuery,該行應該是這樣的:

$(referenceToElement).click(function() { ... }); 

但在任何情況下,它看起來像你的問題是關於匿名函數。您可以將功能分配給一個變量名,或者使用函數聲明和名字仍然引用函數:

function myFunction() { ... } 

$(referenceToElement).click(myFunction);