Oppgave 6

Lag to tekstbokser og en knapp. Når man trykker på knappen skal teksten i den første tekstboksen skrives ut så mange ganger (linje for linje) som man skrev et tall i den andre tekstboksen.

Resultat

Koden

JavaScript

                
window.onload = ready;

function ready() {
    document.getElementById("fireaway").onclick = function() {
        var text = document.getElementById("o6-text").value;
        var times = document.getElementById("o6-times").value;
        var output = document.getElementById("output");
        var tmpChild;
        var tmpText;

        output.innerHTML = ""; // Tøm listen

        // Legg til ny child x antall ganger
        for (var i = 0; i < times; i++) {
            tmpChild = document.createElement("LI");
            tmpText = document.createTextNode(text);
            tmpChild.appendChild(tmpText);

            output.appendChild(tmpChild);
        }
    }
}

HTML

                
<div class="row input-field">
    <label for="o6-text" class="col s1"><i class="icon-text"></i></label>
    <input type="text" id="o6-text" class="col s11" placeholder="Tekst">
</div>
<div class="row input-field">
    <label for="o6-times" class="col s1"><i class="icon-cross-1"></i></label>
    <input type="number" id="o6-times" class="col s11" placeholder="Antall">
</div>
<div class="row input-field">
    <button id="fireaway" class="btn black">Skriv ut</button>
</div>
<ol id="output"></ol>