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.