expertenaustausch > comp.lang.* > comp.lang.javascript

Stefan Mayer (24.11.2019, 15:01)
Hallo Leute

Grade versuche ich selbst das Ereignis "change" auf eine checkbox
anzuwenden, da sind mir ein paar Fragen eingefallen.

Folgender Aufbau:

```
<input id=checkbox type=checkbox name=test value=test>
```

```
const checkbox = document.getElementById('checkbox');
checkbox.addEventListener('change', e => {
if (checkbox.checked) {
// ausgewählt
} else {
// nicht ausgewählt
}
});
```

Ist die Prüfung auf "checkbox.checked" i.O. oder sollte man hier auf
"e.target.checked" prüfen?

Ist "checkbox.checked" === "e.target.checked"?
Bzw. "checkbox.checked" ==
"e.target.checked"?

Wenn nun eine Bedingung erfüllt ist, möchte ich die checkbox selbst
markieren und das Ereignis "change" auslösen, damit der EventListener
informiert wird.

```
if (Bedingung) {
checkbox.checked = true;
checkbox.dispatchEvent(new Event('change'));
}
```

- Muss "Event" tatsächlich selbst erzeugt werden?
- Hat "checkbox" nicht eine Methode die das erledigt (check > dispatch)?
- Warum löst "checkbox.checked = true" das Ereignis nicht aus?

Danke und schönen Sonntag noch.
ciao, Stefan
Stefan Mayer (25.11.2019, 11:55)
Stefan Mayer am Sonntag, 24. November 2019 (14:01):

> ```
> const checkbox = document.getElementById('checkbox');
> checkbox.addEventListener('change', e => {
> if (checkbox.checked) {
> // ausgewählt
> } else {
> // nicht ausgewählt
> }
> });
> ```


> Ist die Prüfung auf "checkbox.checked" i.O. oder sollte man hier auf
> "e.target.checked" prüfen?


> Ist "checkbox.checked" === "e.target.checked"?
> Bzw. "checkbox.checked" == "e.target.checked"?


Überflüssige Frage, einfach probieren?

console.log(checkbox == e.target) // true
console.log(checkbox === e.target) // true

Neue Frage: Ist e.target eine Referenz auf checkbox oder eine Kopie zum Zeitpunkt des
Ereignisses? Ich find's raus.

ciao, Stefan
Stefan Reuther (25.11.2019, 19:29)
Am 25.11.2019 um 10:55 schrieb Stefan Mayer:
> Stefan Mayer am Sonntag, 24. November 2019 (14:01):
>> const checkbox = document.getElementById('checkbox');
>> checkbox.addEventListener('change', e => {
>> if (checkbox.checked) { [...]

> Neue Frage: Ist e.target eine Referenz auf checkbox oder eine Kopie zum Zeitpunkt des
> Ereignisses? Ich find's raus.


Das ist ein DOM-Knoten mit ein paar Fantastilliarden Attributen, der
wird nicht mal eben ohne Not kopiert.

Stefan
Ähnliche Themen