reset a setinterval after once clicking keybored arrows

Question

hi i want to make to move something like a car with setinterval but when i clicked the button after once setinterval called again than its speed looks come more than after clicking so i want use one interval not more can help me? i know answerd this question befor me but it didnt work for me or i cant use it im so tired about that

//variables
var m_tank = document.getElementById("tank");
//var message = document.getElementById("show_car_info");
var iv, a, s;

//functions
function loaded() {
    alert("hello");
}

function start_game(e) {
    a = 0;
    //for (s = 5000; s == 0; s -= 5) {}
    if (e.keyCode == 37 || e.keyCode == 38 || e.keyCode == 39 || e.keyCode == 40) {
        s = 1000;
        iv = setInterval(() => {
            moving(m_tank);
        }, s);
    }
}

function moving(m_tank) {
    a += 10;
    var l_num = m_tank.offsetLeft;
    var t_num = m_tank.offsetTop;
    if (e.keyCode == 39) {
        //alert("ArrowRight");
        l_num += a;
        console.log("right:" + l_num, "a_right:" + a);

    } else if (e.keyCode == 37) {
        //alert("ArrowLeft");
        l_num -= a;
        console.log("left:" + l_num, "a_left:" + a);

    } else if (e.keyCode == 38) {
        //alert("ArrowUp");
        t_num -= a;
        console.log("Up:" + t_num, "a_up:" + a);

    } else if (e.keyCode == 40) {
        //alert("ArrowDown");
        t_num += a;
        console.log("Down:" + t_num, "a_down:" + a);
    }
    m_tank.style.left = l_num + "px";
    m_tank.style.top = t_num + "px";

}

body {
    background-color: lightsteelblue;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    overflow: hidden;
}

#tank {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: brown;
}

<body onload="loaded()" onkeydown="start_game(e=event)">

    <!-- <p id="show_car_info"></p> -->
    <div>
        <div id="tank">
            <p>tank</p>
        </div>
    </div>
</body>

You are already storing the interval in an `iv` variable. You just need to `clearInterval(iv)` before you make a new one. — Taplar, Aug 20 '20 at 17:06
i test your answer but when i clear that my interval clear compleatly i dont want it and i want cintinue without call again — Iman Iman, Aug 20 '20 at 17:09
what you need is an event loop, you can create one using requestAnimationFrame — AngelSalazar, Aug 20 '20 at 17:14
duplicate topic: Refer to: https://stackoverflow.com/questions/8126466/how-do-i-reset-the-setinterval-timer — gtamborero, Aug 20 '20 at 23:16
Does this answer your question? [How do I reset the setInterval timer?](https://stackoverflow.com/questions/8126466/how-do-i-reset-the-setinterval-timer) — Konrad, Aug 21 '20 at 12:56
Hi thanks for your answers my problem in this answer is I have some if in functoin of setinterval so when I clear it and setinterval again it needs to solve the conditions in if and when I did their conditions and make again my problem who has better answer about it ? Please help me — Iman Iman, Aug 21 '20 at 16:17

reset a setinterval after once clicking keybored arrows

0 Answers0