Why does my for loop come once?

debugcn Published at Dev

Taykklan

I've got a code with a loop in my function..

Look a bit to my code please:

<!doctype html>
<html>
<head>
    <title>Test</title>
</head>
<body>
    Kies een tafel:
    <select id="tafels">
    <option value="1">Tafel 1</option>
    <option value="2">Tafel 2</option>
    <option value="3">Tafel 3</option>
    <option value="4">Tafel 4</option>
    <option value="5">Tafel 5</option>
    <option value="6">Tafel 6</option>
    <option value="7">Tafel 7</option>
    <option value="8">Tafel 8</option>
    <option value="9">Tafel 9</option>
    <option value="10">Tafel 10</option>
    </select>
    <input type="submit" id="submit" value="bereken" onclick="tafel23();">
    <div id="asd">
    </div>
    <script>
            function tafel23(){

        var value = document.getElementById('tafels').value;
        var value1 = parseInt(value);
        var teller = 0;

        for(teller = 1; teller <= 10; teller++){
            document.getElementById('asd').innerHTML=(value1 + " x " + teller + " = " + teller * value1 + "<br/>");
        }
        }
    </script>
</body>
</html>

My loop come onces when I click the submit button... But when I do innerHTML+= than it works, the whole loop is appearing, but when I press the submit button again and again, the loop is stacking.. So where I got the problem is, when I press the submit button that the loop will appear, but not again and again..

Thanks in advance guys!<3

pherris

Try clearing the div before you execute the loop:

function tafel23(){

    var value = document.getElementById('tafels').value;
    var value1 = parseInt(value);
    //you might check value1 for NaN here

    document.getElementById('asd').innerHTML=""; //clear it out
    for(var teller = 1; teller <= 10; teller++){
        document.getElementById('asd').innerHTML += value1 + " x " + teller + " = " + teller * value1 + "<br/>";
    }
}

Collected from the Internet

Please contact [email protected] to delete if infringement.