为什么我必须将字母'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元素。有时它们都很方便。 ）

此外，没错，事件对象有一些其他用途：它可以阻止事件的传播等