En Javascript / jQuery que signifie (e)?

Je suis nouveau dans JavaScript / jQuery et j'ai appris à créer des fonctions. De nombreuses fonctions sont apparues avec (e) entre parenthèses. Laissez-moi 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-elle là si souvent?

eest la courte référence var pour l' eventobjet qui sera transmise aux gestionnaires d'événements.

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

Dans l'exemple que vous avez publié, il y a 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 utilisee.whichete.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

AVIS DE NON-RESPONSABILITÉ: Il s'agit d'une réponse très tardive à ce message particulier, mais en lisant diverses réponses à cette question, il m'a frappé 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épondre à la question originale en pensant à un public novice.

Intro

La petite chose « (e) » fait en fait partie d'une portée plus large de quelque chose en Javascript appelé une fonction de gestion d'événements. Chaque fonction de gestion d'événements reçoit un objet événement. Pour les besoins de cette discussion, considérez un objet comme une «chose» qui contient un tas de propriétés ( variables ) et de méthodes ( fonctions ), un peu comme les objets dans d'autres langages. 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 vaguement).

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 balise HTML déclenchera cela).
• "clic" est un événement (lorsque l'élément sélectionné est cliqué).
• "fonction (e)" est la fonction de gestion des événements (lors de 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, "function (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'exécuter l'action par défaut pour cet élément.

Remarque: Le handle peut être nommé à peu près comme vous le souhaitez (c'est-à-dire ' function (billybob) '). Le «e» signifie «événement», ce qui semble être assez standard pour ce type de fonction.

Bien que «e.preventDefault ()» soit 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 accessibles via le gestionnaire d'événements.

De très bonnes informations sur ce sujet peuvent être trouvées sur le site d'apprentissage de jQuery, http://learn.jquery.com . Portez une attention particulière aux sections Utilisation de jQuery Core et Événements .

en'a pas de signification particulière. C'est juste une convention à utiliser ecomme nom de paramètre de fonction lorsque le paramètre est event.

Ça peut être

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

ainsi que.

Dans cet exemple, il es'agit simplement d'un paramètre pour cette fonction, mais c'est l' eventobjet qui est passé par elle.

L' eargument est l'abréviation de l'objet événement. Par exemple, vous pouvez créer du 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 que lorsqu'un utilisateur <a>clique sur une balise, empêche 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 jQuery eabréviation de event, l'objet d'événement actuel. Il est généralement passé en paramètre pour la fonction d'événement à déclencher.

Démo: événements jQuery

Dans la démo j'ai utilisé e

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

J'aurais pu aussi bien utiliser 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 cela aide à la lisibilité. Comprendre cela vous aidera à comprendre la mentalité d'écrire 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 du sens ...

Dans un premier temps, voyons la syntaxe de addEventListener

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

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

type： Une chaîne représentant le type d'événement à écouter.

listener： 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. Il doit s'agir d'un objet implémentant l'interface EventListener ou d'une fonction JavaScript.

(De MDN)

Mais je pense qu'il y a une chose à remarquer: lorsque vous utilisez la fonction Javascript comme écouteur, l'objet qui implémente l'interface Event (événement objet) sera automatiquement affecté au "premier paramètre" de la fonction. Ainsi, si vous utilisez function (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 empêcher quelque chose ....

essayons 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 éviterez l'événement de clic.

mais si vous supprimez le signe 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, car le "e" a été de nouveau défini dans la fonction.

Cependant, si vous modifiez le code en:

<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 fonctionnera à nouveau correctement ... 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 exécutez e.preventDefault (). C'est aussi la raison pour laquelle vous pouvez changer le "e" en n'importe quel mot qui n'est pas réservé par js.

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

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

En référence au code ci-dessus
$(this)est l'élément qui en tant que variable.
clickest l'événement à réaliser.
le paramètre eest automatiquement passé de js à votre fonction qui contient la valeur de $(this)value et peut être utilisé plus loin dans votre code pour effectuer une opération.