Question

我使用setInterval为动态创建的元素设置了动画。单击元素时，我希望它更改为随机方向（向左，向右，向上或向下）。

我认为问题在于我无法将随机创建的方向传递给setInterval函数。

这里的HTML ....

<div id="klicker"></div>

这里的JavaScript .....

var box = document.getElementById("klicker");
var x = 1;
var startp = 200;
box.onclick = function() {
    var newdiv = document.createElement('div');
    document.body.appendChild(newdiv);
    newdiv.style.width = 200 + 'px';
    newdiv.style.height = 200 + 'px';
    newdiv.style.backgroundColor = 'grey';
    newdiv.style.position = 'absolute';
    newdiv.style.left = startp + "px";
    newdiv.style.top = startp + "px";
    newdiv.setAttribute('id', 'runner')
    var run = document.getElementById('runner');
    var dire = 'right';
    run.onclick = function() {
        var mov = function() {
            randoms();
        };
        function randoms() {
            alert('ddddd');
            var rnd = (Math.random() * 4) + 1; //ranom number 1-4
            var rnd_down = Math.floor(rnd); //make it en integer
            /*--- make each number a uniqe direction---*/
            if (rnd_down == 1) {
                dire = 'right';
            } else if (rnd_down == 2) {
                dire = 'left';
            } else if (rnd_down == 3) {
                dire = 'up';
            } else {
                dire = 'down';
            }
        };

        var moveit = setInterval(function() {
            movefunc();
        }, 50);

        function movefunc() {
            /*----each direction will make the div travel in diffrent directions--*/
            if (dire = 'right') {
                x = x + 1;
                newdiv.style.left = x + 'px';
            } else if (dire = 'left') {
                x = x - 1;
                newdiv.style.left = x + 'px';
            } else if (dire = 'up') {
                x = x - 1;
                newdiv.style.top = x + 'px';
            } else {
                x = x + 1;
                newdiv.style.top = x + 'px';
            }
        };
    };
}

Answer 1

function movefunc() {
            /*----each direction will make the div travel in diffrent directions--*/
            if (dire = 'right') {
                x = x + 1;
                newdiv.style.left = x + 'px';
            } else if (dire = 'left') {
                x = x - 1;
                newdiv.style.left = x + 'px';
            } else if (dire = 'up') {
                x = x - 1;
                newdiv.style.top = x + 'px';
            } else {
                x = x + 1;
                newdiv.style.top = x + 'px';
            }
        };

新秀错误:)（即使它是most common error in programming中的一个，请参阅＃4）在你的情况下，你应该使用==而不是=（这是用于分配，==用于比较）。我甚至建议你使用===来比较各种类型。（1 == '1'将返回true，而1 === '1'将返回false，因为1是integer类型，＆＃39; 1＆＃39;是{{1} 1}}类型）

将随机生成的变量传递给setInterval

1 个答案: