In JavaScript/Jquery What Does (E) Mean

In Javascript/jQuery what does (e) mean?

e is the short var reference for event object which will be passed to event handlers.

The event object essentially has lot of interesting methods and properties that can be used in the event handlers.

In the example you have posted is a click handler which is a MouseEvent

$(<element selector>).click(function(e) {
// does something
alert(e.type); //will return you click
}

DEMO - Mouse Events DEMO uses e.which and e.type

Some useful references:

http://api.jquery.com/category/events/

http://www.quirksmode.org/js/events_properties.html

http://www.javascriptkit.com/jsref/event.shtml

http://www.quirksmode.org/dom/events/index.html

http://www.w3.org/TR/DOM-Level-3-Events/#event-types-list

jQuery: what does the (e) in function (e) stand for?

e is an event object, it contains event data. Refer to jQuery Event Type, where you can find description of attributes and methods:

Attributes:

  1. event.type
  2. event.target
  3. event.data
  4. event.relatedTarget
  5. event.currentTarget
  6. event.pageX/Y
  7. event.result
  8. event.timeStamp

Methods:

  1. event.preventDefault()
  2. event.isDefaultPrevented()
  3. event.stopPropagation()
  4. event.isPropagationStopped()
  5. event.stopImmediatePropagation()
  6. event.isImmediatePropagationStopped()

What does e mean in this function definition?

Here, e is an event object, as defined here: http://api.jquery.com/category/events/event-object/

Yes you can pass data to the handler, using this form for the click function:

.click( [eventData], handler(eventObject) )

eventData A map of data that will be passed to the event handler.
handler(eventObject) A function to execute each time the event is triggered.

It will be accessible as e.data in the handler.

jquery/javascript: function(e){.... what is e? why is it needed? what does it actually do/accomplish?

Using e is just a short for event. You can pass any variable name you desire.

// would work just the same
$('#myTable').click(function(anyothername) {
var clicked = $(anyothername.target);
});

You can check out more on jQuery's handling of events.

Where does e come from in Jquery and JS?

When using jQuery the e parameter (which you can rename to anything you like) is going to be an Event object passed to your event handler method by jQuery. The Event object is jQuery's wrapper type for browser event interfaces so that you can have a standard interface in your handlers see here - jQuery.

That type has a property called 'target' which points to the original native browser event interface that jQuery was given by the browser. For example for mouse clicks the native interface would be this for example. Note actual interface may differ across browser implementations particularly older ones which is why jQuery attempts to provide some consistency via their type.

jquery (e) function parameter meaning

In your case e refers to jQuery object itself and is used for preventing conflict with other libraries that use $. The first parameter of ready handler refers to the jQuery object. In this case using e as a reference to jQuery is not a good decision and if DreamWeaver wrongfully chooses/passes e, you should change it yourself.

jQuery(document).ready(function($) {
$('query').foo();
});

Reference.

But generally e is used as an alias for event object in other cases.

$('element').on('event', function(e) {
var eventObject = e;
});

what's the purpose and meaning of e in jquery code

what you have is an anonymous, self-executing function.

the function is passed the jquery object (which is a function). e(".pic") is the same as $(".pic") or jQuery(".pic") because e is just a reference to jQuery.

What exactly is the parameter e (event) and why pass it to JavaScript functions?

The e is short for event

The simplest way to create an event is to click somewhere on the page.

When you click, a click event is triggered. This event is actually an object containing information about the action that just happened. In this example's case, the event would have info such as the coordinates of the click (event.screenX for example), the element on which you clicked (event.target), and much more.

Now, events happen all the time, however you are not interested in all the events that happen. When you are interested in some event however, it's when you add an event listener to the element you know will create events[1]. For example you are interested in knowing when the user clicks on a 'Subscribe' button and you want to do something when this event happens.

In order to do something about this event you bind an event handler to the button you are interested in. The way to bind the handler to the element is by doing element.addEventListener(eventName, handler).

eventName is a string and it's the name of the event you are interested in, in this case that would be 'click' (for the "click" event).

The handler is simply a function which does something (it's executed) when the event happens. The handler function, by default, when executed is passed the event object (that was created when the event/action you are interested in happened) as an argument.

Defining the event as a parameter of your handler function is optional but, sometimes (most times), it is useful for the handler function to know about the event that happened. When you do define it this is the e you see in the functions like the ones you mentioned. Remember, the event is just a regular javascript object, with lots of properties on it.

Hope that helped.

For more info read Creating and Triggering Events

As for your 3rd question, now you should know you cannot do that, because e only exists when an event happens. You could have the handler function, which has access to the e object when it gets executed, to store it in some global variable and work on that.

[1] That is not exactly correct, but it's simpler to understand. The more correct thing to say there is "add an event listener to the element you know will have events flow through it". See this for more information



Related Topics



Leave a reply



Submit