Heute habe ich gerade einen Beitrag über "Warum verwenden wir die Buchstaben" e "in e.preventDefault ()?" Geschrieben. und ich denke, meine Antwort wird einen Sinn ergeben ...
Lassen Sie uns zunächst die Syntax von addEventListener sehen
Normalerweise ist es:
target.addEventListener (Typ, Listener [, useCapture]);
Und die Definition der Parameter von addEventlistener sind:
Typ : Eine Zeichenfolge, die den Ereignistyp darstellt, auf den gewartet werden soll.
Listener : Das Objekt, das eine Benachrichtigung erhält (ein Objekt, das die Ereignisschnittstelle implementiert), wenn ein Ereignis des angegebenen Typs auftritt. Dies muss ein Objekt sein, das die EventListener-Schnittstelle implementiert, oder eine JavaScript-Funktion.
(Von MDN)
Ich denke jedoch, dass eines beachtet werden sollte:
Wenn Sie die Javascript-Funktion als Listener verwenden, wird das Objekt, das die Ereignisschnittstelle (Objektereignis) implementiert, automatisch dem "ersten Parameter" der Funktion zugewiesen Funktion (e), das Objekt wird "e" zugewiesen, da "e" der einzige Parameter der Funktion ist (definitiv der erste!), dann können Sie e.preventDefault verwenden, um etwas zu verhindern ....
Versuchen wir das folgende Beispiel:
<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>
Das Ergebnis ist: [Objekt MouseEvent] 5 und Sie verhindern das Klickereignis .
aber wenn Sie das Kommentarzeichen entfernen wie:
<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>
Sie erhalten: 8 und einen Fehler : "Nicht erfasster TypeError: e.preventDefault ist keine Funktion bei HTMLInputElement. (VM409: 69)".
Natürlich wird das Klickereignis diesmal nicht verhindert. Weil das "e" in der Funktion erneut definiert wurde.
Wenn Sie den Code jedoch ändern in:
<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>
Alles wird wieder richtig funktionieren ... Sie erhalten 8 und das Klickereignis wird verhindert ...
Daher ist "e" nur ein Parameter Ihrer Funktion und Sie benötigen ein "e" in Ihrer Funktion (), um das "Ereignisobjekt" zu empfangen, und führen dann e.preventDefault () aus. Dies ist auch der Grund, warum Sie das "e" in Wörter ändern können, die nicht von js reserviert sind.