Javascript: input-Element nachträglich einbinden - oninput und onblur funzen nicht
bearbeitet vonLieber Linuchs,
> ~~~js,bad
> input_1.autocomplete= "off";
> input_1.oninput = "getLieder( this )";
> input_1.onblur = "getLiederSchliessen()";
> ~~~
Du verwendest uralte JavaScript-Mechanismen, von denen Du besser die Finger lassen solltest, weil sie damals mangels besserer Alternativen eine Notlösung waren.
Du notierst mit `input_1.onirgendwas = "ein String"`{:.language-javascript} im Grunde den Textinhalt eines HTML-Attributs gleichen Namens (hier *onirgendwas*). Was Du hier stattdessen tun solltest, ist einen passenden EventListener zu notieren:
~~~ js
input_1.addEventListener("irgendwas" function (event) {
// hier passiert etwas wenn das Event "irgendwas" feuert
});
// das gleiche mit einer Pfeilfunktion für input-Events
input_1.addEventListener("input" event => {
// event ist vom Typ "input"
});
// wenn Du eine Funktion öfters benötigst
function meineBlurFunktion (node) {
// node ist eine Referenz auf ein <input> element
}
// die anonyme Funktion (zweiter Parameter nach "blur")
// enthält eine gekapselte Variable "input_1" (Closure):
input_1.addEventListener("blur", function () {
meineBlurFunktion(input_1);
});
~~~
Bitte lasse künftig ab von diesen veralteten onirgendwas-Attributen/-Eigenschaften! Du machst Dir das Leben damit nicht leichter, weil Du nicht sicher sagen kannst, warum etwas (nicht) funktioniert.
→ [unser Wiki zu Eventhandler-Funktionen und wie man sie an Elemente bindet](https://wiki.selfhtml.org/wiki/JavaScript/DOM/EventTarget/addEventListener)
Liebe Grüße
Felix Riesterer