Ammeres: JS - Variablen in HTML mehrfach belegen, mit einer Funktion auswerten

Beitrag lesen

Eben. Aber du machst ein getElementById darauf. Und deswegen referierte ich über verwirrende Benennungen.

Point taken.

Ich habe den Code diesbezüglich nochmal eindeutig benannt und erneut ausgemistet:

<!DOCTYPE html>
<html lang="de">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="JavaScript.js" async></script>
</head>

<body>
    <form>
        <fieldset>
            <select id="Value-Quelle">
                <option value="-">-</option>
                <option value="Sichtbar">Ja</option>
                <option value="andererValue">Nein</option>
            </select>
        </fieldset>

        <fieldset id="Un-Hide">
            <!-- Dieses soll bei "Ja" / "Sichtbar" eingeblendet, sonst hidden sein. -->
            <legend>Sichtbarkeitstest</legend>
        </fieldset>
    </form>
</body>

</html>

sowie JS:

'use strict';

document.addEventListener("DOMContentLoaded", registerEventListenerHidden);

function registerEventListenerHidden() {
    document.getElementById("Value-Quelle").addEventListener("change", function EinAusblenden() {
        document.getElementById("Un-Hide").hidden = (document.getElementById("Value-Quelle").value != "Sichtbar");
    });