Dans Javascript / jQuery, qu'est-ce que signifie e)?

Je suis nouveau sur JavaScript / jQuery et j'ai appris à créer des fonctions. Beaucoup de fonctions ont été mises en évidence avec (e) entre parenthèses. Permettez-moi de vous montrer ce que je veux dire:

$(this).click(function(e) { // does something }); 

Il semble toujours que la fonction n'utilise même pas la valeur de (e), alors pourquoi est-ce là aussi souvent?

e est la courte référence var pour l'objet event qui sera transmis aux gestionnaires d'événements.

L'objet événement a essentiellement beaucoup de méthodes intéressantes et les propriétés qui peuvent être utilisées dans les gestionnaires d'événements.

Dans l'exemple que vous avez posté est un gestionnaire de clics qui est un MouseEvent

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

DEMO – Mouse Events DEMO utilise e.which et e.type

Quelques références utiles:

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

e n'a aucune signification particulière. C'est juste une convention d'utiliser e comme nom de paramètre de fonction lorsque le paramètre est event .

Ça peut être

 $(this).click(function(loremipsumdolorsitamet) { // does something } 

ainsi que.

AVERTISSEMENT: Il s'agit d'une réponse très tardive à ce post particulier, mais comme j'ai lu plusieurs réponses à cette question, il m'a semblé que la plupart des réponses utilisent une terminologie qui ne peut être comprise que par des codeurs expérimentés. Cette réponse est une tentative de résoudre la question initiale avec un public novice à l'esprit.

Intro

La petite chose ' (e) ' fait en fait partie d'une portée plus large de Javascript appelée fonction de gestion d'événement. Chaque fonction de traitement d'événement reçoit un objet d'événement. Aux fins de cette discussion, pensez à un objet comme une "chose" qui détient un tas de propriétés ( variables ) et de méthodes ( fonctions ), tout comme les objets dans d'autres langues. La poignée, le ' e ' à l'intérieur de la petite chose (e) , est comme une variable qui vous permet d'interagir avec l'objet (et j'utilise le terme variable très faiblement).

Considérez les exemples jQuery suivants:

 $("#someLink").on("click", function(e){ // My preferred method e.preventDefault(); }); $("#someLink").click(function(e){ // Some use this method too e.preventDefault(); }); 

Explication

  • "#someLink" est votre sélecteur d'élément (quelle étiquette HTML déclenchera).
  • "Cliquer" est un événement (lorsque l'élément sélectionné est cliqué).
  • "Fonction (e)" est la fonction de gestion des événements (sur l'événement, l'objet est créé).
  • "E" est le gestionnaire d'objets (l'objet est rendu accessible).
  • "PreventDefault ()" est une méthode (fonction) fournie par l'objet.

Que ce passe-t-il?
Lorsqu'un utilisateur clique sur l'élément avec l'id "#someLink" (probablement une balise d'ancrage), appelez une fonction anonyme, "fonction (e)" , et attribuez l'objet résultant à un gestionnaire, "e" . Maintenant, prenez ce gestionnaire et appelez l'une de ses méthodes, "e.preventDefault ()" , ce qui devrait empêcher le navigateur d'effectuer l'action par défaut pour cet élément.

Remarque: La poignée peut être nommée tout ce que vous voulez (c.-à-d. ' Function (billybob) '). Le «e» signifie «événement», ce qui semble être assez standard pour ce type de fonction.

Même si 'e.preventDefault ()' est probablement l'utilisation la plus courante du gestionnaire d'événements, l'objet lui-même contient de nombreuses propriétés et méthodes auxquelles on peut accéder via le gestionnaire d'événements.

Des informations très intéressantes sur ce sujet peuvent être trouvées sur le site d'apprentissage de jQuery, http://learn.jquery.com . Faites une attention particulière aux sections Utilisation de jQuery Core et Events .

L'argument e est court pour l'objet événement. Par exemple, vous pouvez créer un code pour les ancres qui annule l'action par défaut. Pour ce faire, vous écririez quelque chose comme:

 $('a').click(function(e) { e.preventDefault(); } 

Cela signifie quand une balise <a> est cliquée, empêcher l'action par défaut de l'événement de clic.

Bien que vous puissiez le voir souvent, ce n'est pas quelque chose que vous devez utiliser dans la fonction même si vous l'avez spécifié comme argument.

Dans cet exemple, e est juste un paramètre pour cette fonction, mais c'est l'objet event qui se transmet à travers elle.

Dans jQuery e short for event , l'objet d'événement actuel. Il est généralement adopté comme paramètre pour que la fonction d'événement soit déclenchée.

Démonstration: jQuery Events

Dans la démo, j'ai utilisé e

 $("img").on("click dblclick mouseover mouseout",function(e){ $("h1").html("Event: " + e.type); }); 

Je pourrais aussi bien avoir utilisé l' event

  $("img").on("click dblclick mouseover mouseout",function(event){ $("h1").html("Event: " + event.type); }); 

Même chose!

Les programmeurs sont paresseux, nous utilisons beaucoup de sténographie, en partie, cela diminue notre travail, en partie contribue à la lisibilité. La compréhension qui vous aidera à comprendre la mentalité de l'écriture du code.

Aujourd'hui, je viens d'écrire un article sur "Pourquoi utilisons-nous les lettres comme" e "dans e.preventDefault ()?" Et je pense que ma réponse aura un certain sens …

Au début, voyons la syntaxe de addEventListener

Normalement, ce sera: target.addEventListener (type, listenener [, useCapture]);

Et la définition des paramètres de addEventlistener est:

Type : une chaîne représentant le type d'événement à écouter.

Listenener : l'objet qui reçoit une notification (un objet qui implémente l'interface Event) lorsqu'un événement du type spécifié se produit. Cela doit être un objet implémentant l'interface EventListener, ou une fonction JavaScript.

(De MDN)

Mais je pense qu'il y a une chose à remarquer: lorsque vous utilisez la fonction Javascript comme auditeur, l'objet qui implémente l'interface Événement (événement objet) sera automatiquement affecté au "premier paramètre" de la fonction. Si vous utilisez Fonction (e), l'objet sera affecté à "e" car "e" est le seul paramètre de la fonction (définitivement le premier!), Alors vous pouvez utiliser e.preventDefault pour éviter quelque chose …

Permettez-nous d'essayer l'exemple ci-dessous:

 <p>Please click on the checkbox control.</p> <form> <label for="id-checkbox">Checkbox</label> <input type="checkbox" id="id-checkbox"/> </div> </form> <script> document.querySelector("#id-checkbox").addEventListener("click", function(e,v){ //var e=3; var v=5; var t=e+v; console.log(t); e.preventDefault(); }, false); </script> 

Le résultat sera: [objet MouseEvent] 5 et vous empêcherez l'événement de clic.

Mais si vous supprimez le panneau de commentaire comme:

 <script> document.querySelector("#id-checkbox").addEventListener("click", function(e,v){ var e=3; var v=5; var t=e+v; console.log(t); e.preventDefault(); }, false); </script> 

Vous obtiendrez: 8 et une erreur : "Uncaught TypeError: e.preventDefault n'est pas une fonction à HTMLInputElement. (VM409: 69)".

Certes, l'événement de clic ne sera pas empêché cette fois. Parce que le "e" a été défini à nouveau dans la fonction.

Toutefois, si vous modifiez le code pour:

 <script> document.querySelector("#id-checkbox").addEventListener("click", function(e,v){ var e=3; var v=5; var t=e+v; console.log(t); event.preventDefault(); }, false); </script> 

Tout va bien fonctionner de nouveau … vous obtiendrez 8 et l'événement de clic sera évité

Par conséquent, "e" est juste un paramètre de votre fonction et vous avez besoin d'un "e" dans votre fonction () pour recevoir l'objet "événement" puis effectuez e.preventDefault (). C'est aussi la raison pour laquelle vous pouvez changer le "e" à tous les mots qui ne sont pas réservés par js.

C'est une référence à l'objet d'événement actuel