Question

我正在开展一个学校项目，我们刚开始学习JavaScript。我必须创建一个脚本，使用JS移动一些东西。好吧，我制作了以下剧本：

var object = document.getElementById("object");
        var omhoog = document.getElementById("omhoog");
        var omlaag = document.getElementById("omlaag");
        var links = document.getElementById("links");
        var rechts = document.getElementById("rechts");

        object.style.left = '0px';
        object.style.top = '0px';

        omlaag.onclick = function()
        {
            var positiehuidigtop = parseInt(object.style.top);
            setInterval(function()
            {
                if (parseInt(object.style.top)<positiehuidigtop+100)
                {
                    object.style.top = (parseInt(object.style.top) + 10) + 'px';
                }
            }, 10);
        }

        links.onclick = function()
        {
            var positiehuidigleft = parseInt(object.style.left);
            setInterval(function()
            {
                if (parseInt(object.style.left)>positiehuidigleft-100)
                {
                    object.style.left = (parseInt(object.style.left) - 10) + 'px';
                }
            }, 10);
        }

        rechts.onclick = function()
        {
            var positiehuidigleft = parseInt(object.style.left);
            setInterval(function()
            {
                if (parseInt(object.style.left)<positiehuidigleft+100)
                {
                    object.style.left = (parseInt(object.style.left) + 10) + 'px';
                }
            }, 10);
        }

很抱歉那里有荷兰人的东西，但这是变数，所以名字并不重要。

无论如何，起初我只是让脚本的一部分让div向右移动。工作就像一个魅力。但是当我开始添加左边时，它会介入。两个方向都是战斗。

我真的不知道该怎么做，这件事让我头疼：/

Answer 1

在开始新的间隔计时器之前，您应该使用clearInterval来停止已经运行的间隔计时器。

var currentInterval;

omlaag.onclick = function() {
    clearInterval(currentInterval);
    currentInterval = setInterval(
        ...
    );
};

rechts.onclick = function() {
    clearInterval(currentInterval);
    currentInterval = setInterval(
        ...
    );
};

你如何防止JS运动的横向干扰？

1 个答案: