HESLO V JS PHP

Zadání:
Vytvořte formulář pro zadání hesla, po odeslání ověřte správnost a vypište hlášku.

K tomuto příkladu budeme potřebovat formulář na heslo, kterému dáme id a jméno h. Poté vytvoříme HTML div, kterému dáme id. Do divu budeme později vypisovat výstup.

JavaScriptový kód vždy začínáme otevíracím tagem scriptu(<script>), ukončujeme ho uzavíracím tagem scriptu (</script>).

JavaScript prvně prohledá celou stránku pro formulář s id hesloForm díky document.getElementById. Poté díky addEventListener počká až uživatel zmáčkne tlačítko hádej (submit).

Jako další vytvoříme proměnnou zprava, do které vložíme prázdné uvozovky.

Poté použijeme podmínku if(). V ní porovnáme vstup se správným heslem. Pokud heslo uživatel uhodl, přidáme do výstupu oslavnou zprávu. V opačném případě pak smutnou zprávu o tom, že heslo nebylo uhádnuto.

Nakonec zprávu vložíme do HTML divu.

<form id="hesloForm">
    Zadej heslo:
    <input type="password" id="h" name="h" /><br />
    <input type="submit" value="Hádej" />
</form>

<div id="heslo-vysledek"></div>

<script>
    document.getElementById("hesloForm").addEventListener("submit", function (e) {
        e.preventDefault();
        const h = document.getElementById("h").value;
        let zprava = "";

        if (h == "ahoj") {
            zprava = `<h2>Gratuluji, heslo bylo opravdu: ${h}</h2>`;
        }
        else {
            zprava = "<h2>Špatné heslo :(</h2>";
        }
        document.getElementById("heslo-vysledek").innerHTML = zprava;
    });
</script>