Que signifie (e) en Javascript / jQuery?
Je suis nouveau sur JavaScript/jQuery et j'ai appris à créer des fonctions. Beaucoup de 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?
e est la référence var courte pour l'objet event qui sera transmis 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 posté est un gestionnaire de clic qui est un MouseEvent
$(<element selector>).click(function(e) {
// does something
alert(e.type); //will return you click
}
[~ # ~] démo [~ # ~] - Événements de souris 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
CLAUSE DE NON-RESPONSABILITÉ: Ceci est une réponse très tardive à ce poste en particulier, mais comme je lisais diverses réponses à cette question, je suis frappé par le fait que la plupart des réponses utilisent une terminologie incompréhensible. par des codeurs expérimentés. Cette réponse tente de répondre à la question initiale avec un public novice en tête.
Intro
La petite chose (e) 'fait en fait partie de la portée plus large de quelque chose en Javascript appelé fonction de gestion des événements. Chaque fonction de gestion d'événements reçoit un objet événement. Pour les besoins de cette discussion, imaginez un objet comme une "chose" contenant un tas de propriétés ( variables) et de méthodes ( fonctions), beaucoup comme des objets dans d'autres langues. Le handle, le ' e' à l'intérieur du petit (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 ceci).
- "click" est un événement (lorsque l'utilisateur sélectionne l'élément sélectionné).
- "fonction (e)" est la fonction de gestion des événements (sur événement, l'objet est créé).
- "e" est le gestionnaire d'objet (l'objet est rendu accessible).
- "preventDefault ()" est une méthode (fonction) fournie par l'objet.
Que se passe-t-il?
Lorsqu'un utilisateur clique sur l'élément portant l'id "# someLink" (probablement une balise d'ancrage), appelle 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'effectuer l'action par défaut sur cet élément.
Remarque: Le descripteur peut être nommé 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.
Vous trouverez de très bonnes informations sur ce sujet sur le site d’apprentissage de jQuery, http://learn.jquery.com . Portez une attention particulière aux sections tilisation de jQuery Core et Événements .
e n'a pas de 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.
Dans cet exemple, e n'est qu'un paramètre pour cette fonction, mais c'est l'objet event qui y est transmis.
L'argument e est l'abréviation de 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 un <a> La balise _ est cliquée, empêche l’action par défaut de l’événement click.
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é en tant qu'argument.
Dans jQuery e raccourci pour event, l'objet événement en cours. Il est généralement passé en tant que paramètre pour que la fonction d'événement soit déclenchée.
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'ai peut-être aussi bien utilisé 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 raccourci, en partie, cela diminue notre travail, en partie, contribue à la lisibilité. Comprendre qui 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 un sens ...
Voyons tout d'abord la syntaxe de addEventListener
Normalement, ce sera: target.addEventListener (type, listener [ useCapture]);)
Et les définition des paramètres de addEventlistener sont:
type ： Une chaîne représentant le type d'événement à écouter.
écouteur ： 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 ya une chose à noter: Lorsque vous utilisez la fonction Javascript comme auditeur, l’objet qui implémente l’interface Event (object event) sera automatiquement attribué à la "first paramètre " de la fonction. Alors, si vous utilisez la fonction (e), l'objet sera affecté à" e "car" e "est le seul paramètre de la fonction (définitivement le premier!), alors vous pouvez Utilisez e.preventDefault pour éviter 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: [object MouseEvent] 5 et vous empêcherez l'événement click.
mais si vous supprimez le commentaire, signez 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 un error: "TypeError non capturé: e.preventDefault n'est pas une fonction de HTMLInputElement. (VM409: 69)".
Évidemment, l'événement click 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 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>
chaque chose fonctionnera à nouveau correctement ... vous obtiendrez 8 et l'événement clic sera évité ...
Par conséquent, "e" n'est qu'un paramètre de votre fonction et vous avez besoin d'un "e" dans function () pour recevoir "l'objet d'é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 en cours