爲什麼我必須將字母'e'傳遞給這個jQuery函數？

Question

我知道E是'事件'的簡稱，但它仍然不清楚爲什麼我需要使用它？我嘗試通過函數傳遞其他字母，它似乎沒有工作。是否還有其他需要將特定字母傳遞給函數的情況？

$("#myThing").click(function (e) { 
    var hit = $(e.target); 
    hit.css('color','blue'); 
}); 

這做同樣的事：

$("#myThing").click(function() { 
    $(this).css('color','blue'); 
}); 

什麼時候應該使用$（這）與 'E'？

謝謝！

Answer 1

您不需要通過函數傳遞特定字母。

$("#myThing").click(function (e) { 
    var hit = $(e.target); 
    hit.css('color','blue'); 
}); 

相同

$("#myThing").click(function (foo) { 
    var hit = $(foo.target); 
    hit.css('color','blue'); 
}); 

等

使用$(e.target)和$(this)之間的差值可以是相當多顯著雖然，因爲this將始終是在其上捆綁所述事件的元素，而e.target將被點擊的特定元素，即使它位於this元素內

希望有道理

Answer 2

名稱e是沒有意義的;你可以隨心所欲地調用它（顯然，只要你更新了對e的引用）。

您發佈的代碼將通常做同樣的事情;但看到下面的代碼：

​<div><span>Hi</span></div>​​​​​​​​​​​​​​​​​​ 

JS：

​$('div').on('click', function (e) { 
    alert(this === e.target); 
});​​​​​ 

（運行在這裏：http://jsfiddle.net/Dxbwm/）

你會看到它的錯誤;那是因爲this是處理事件的元素，但e.target是事件源自的元素（在上面的示例中是跨度）。如果你以前不知道這樣的事件，它叫做事件冒泡，你可以閱讀更多關於它here^我的博客。

Answer 3

事件可以攜帶數據（例如Dropped文件）。如果您需要參考屬於該事件的數據，請使用「e」。如果您只需要引用事件觸發的元素 - 這是在事件回調中引用的「this」，請使用「this」。

Answer 4

這兩個片段之間有一個小小的差異：第一個片段hit不可能是#myThing元素本身。

讓我們說#myThing是<p>和你點擊一個鏈接裏面它：那麼當該事件將達到#myThing，由e.target提到的元素是鏈接，而不是一段

相反，在第二個例子中，顏色變化的元素將始終爲#myThing

所以，如果您將事件與處理程序一起傳遞，這是因爲您在使用該事件方面很方便。當您通過它時，您可以將其命名爲e或evt或foobar：由於您使用的是jQuery，因此您選擇的變量名稱不相關（但爲了簡單起見，e簡短且廣泛使用）。

最常見的原因，以傳遞事件通常是

1. 阻止事件的默認行爲;
2. 停止事件的傳播;
3. —這是您的場景—處理觸發事件的原始元素（通常是在處理事件委託或實時更新文檔時）;
4. 檢查一些事件屬性（例如，在keyup/down事件上的e.keycode）;

Answer 5

參見，在這種情況下，event.target和this指的是相同的元素。但是，當你使用jQuery event delegation，他們可能不匹配：

$('body').on('click', 'tr', function(event) { ... }); 

這裏event.target將把該事件被觸發時，元素（也可能是「TD」元素或其子女等），但this將參考tr元素。有時它們都很方便。 ）

此外，沒錯，事件對象有一些其他用途：它可以阻止事件的傳播等