2025 js input

Input från tangentbordet kan göras på följande vis. Först en enkel lösning sedan en mer praktisk lösning.

Enkel lösning

Kod på GitHub.

Kör koden. Läs koden. Lista ut hur det fungerar.

Uppgift

Ändra så att koden frågar efter favoritfärg.

Mer praktisk lösning

Kod på GitHub.

JavaScript-koden

Kör koden. Läs koden. Försök att förstå hur det fungerar.

let input_element = document.getElementById("js-input");

// lyssnar på att knapp trycks ner
input_element.addEventListener('keydown', function (e) {
    // variabeln e innehåller information om keydown-händelsen
    // körs när tangent trycks ner
    console.log("tryckt " + e.key);
    if (e.key === 'Enter') {
      let user_name = input_element.value;
      let output_element = document.getElementById("js-output");
      output_element.innerText = "Hej " + user_name + "!";
    }
});

Mer om keydown på Mozilla Developer Network.

Uppgifter

favoritfärg

Fråga efter favoritfärg.

Svara: Blå är en tjusig färg.

Om användaren matade in blå.

längd

Fråga efter kön och fråga efter längd i centimeter.

Medellängd för kvinnor är 168 cm och för män 182 cm.

Svara med: du är medellång, du är kortare än medel, eller du är längre än medel.