1

我知道 E 是“事件”的缩写，但我仍然不清楚为什么需要使用它？我尝试通过该函数传递其他字母，但它似乎不起作用。还有其他情况我需要将特定字母传递给函数吗？

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

这做同样的事情：

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

我什么时候应该使用 $(this) 而不是 'e'？

谢谢！

4

5 回答 5

4

您不需要通过该函数传递特定的字母。

$("#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元素内部

Hope that made sense

于 2012-06-15T14:38:09.743 回答
2

The name e is meaningless; you can call it whatever you want (obviously so long as you update the references to e as well).

The code you posted will usually do the same thing; but see the following code:

​&lt;div><span>Hi</span></div>​​​​​​​​​​​​​​​​​​

JS:

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

(Run in here: http://jsfiddle.net/Dxbwm/)

You'll see it's false; thats because this is the element the event is handled on, but e.target is the element the event originated from (which in the example above, is the span). If you didn't know events worked like this before, it's called event bubbling and you can read more about it heremy blog.

于 2012-06-15T14:38:15.407 回答
1

Events can carry data with them (eg a Dropped file). If you need to refer to the data that belongs to the event, use "e". If you only need to refer to the element that the event was triggered from - which is what 'this' refers to in an event callback - use 'this'.

于 2012-06-15T14:38:42.490 回答
1

there's a small difference between the two snippets: in the first one, the element hit could not be the #myThing element itself.

Let say that #myThing is a <p> and you have clicked on a link inside it: then when the event will reach #myThing, the element referred by e.target is the link and not the paragraph

On the contrary, in the second example the element subject to a color change will always be #myThing

So, if you pass the event along with the handler it's because you have a convenience on using that event. When you pass it, you can name it e or evt or also foobar: since you're using jQuery the variable name you choose is not relevant (but for the sake of simplicity e is short and widely used).

The most common reasons to pass the event usually are

  1. prevent the default behavior of the event;
  2. stop the propagation of the event;
  3. — it's your scenario — deal with the original element in which the event was triggered (often when you're dealing with event delegation or with live update of your document);
  4. check some of the event properties (e.g. e.keycode on keyup/down event);
于 2012-06-15T14:39:47.147 回答
1

See, in this case event.target and this are referring to the same element. But when you use jQuery event delegation, they may not match:

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

Here event.target will refer to the element at which the event was triggered (it may be 'td' element or its children, for example), but this will refer to the tr element. Sometimes it's quite handy to have both of them. )

Besides, yes, event object has some other uses: with it you can stop propagation of the event, etc.

于 2012-06-15T14:40:54.337 回答