Javascript setTimeout（）函数不是'；行不通

我希望动画持续工作，但控制台中始终会出现错误：“VM1179:1未捕获引用错误：未定义移动”。不知道为什么。。。复制下面的代码

$(document).ready(function(){

    function move(){
        $("#block").animate({left:"+=50px" },1000).animate({top:"+=50px"},1000).animate({left:"-=20px"},1000).animate({top:"-=20px"});
        setTimeout('move()',1000);
    }
    move()
})

---

以下是您需要看到的内容：

$(function(){

function ba(){
   $('#block').animate({left:'+=50px' }, 1000).animate({top:'+=50px'}, 1000).animate({left:"-=20px"}, 1000).animate({top:'-=20px'}, 1000);
}
function move(){
  ba();
  setTimeout(ba, 1000);
}
move();

});

---

以下是您需要看到的内容：

$(function(){

function ba(){
   $('#block').animate({left:'+=50px' }, 1000).animate({top:'+=50px'}, 1000).animate({left:"-=20px"}, 1000).animate({top:'-=20px'}, 1000);
}
function move(){
  ba();
  setTimeout(ba, 1000);
}
move();

});

---

被否决的答案是正确的。setTimeout接受函数值（未调用的函数），而不是像您这样调用的函数：

setTimeout（'move（）'，1000）

请尝试以下方法：
setTimeout（移动，1000）
被否决的答案是正确的。setTimeout接受函数值（未调用的函数），而不是像您这样调用的函数：
setTimeout（'move（）'，1000）

请尝试以下方法：
setTimeout（移动，1000）
因为我发现您的脚本运行良好。但你可以这样做

$(document).ready(function(){
    move();
});

function move(){
        $("#block").animate({left:"+=50px" },1000).animate({top:"+=50px"},1000).animate({left:"-=20px"},1000).animate({top:"-=20px"});
        setTimeout('move()',1000);
}

我发现你的剧本写得很好。但你可以这样做

$(document).ready(function(){
    move();
});

function move(){
        $("#block").animate({left:"+=50px" },1000).animate({top:"+=50px"},1000).animate({left:"-=20px"},1000).animate({top:"-=20px"});
        setTimeout('move()',1000);
}

在可以使用的每一秒调用一个函数

<script type="text/javascript">
        $(document).ready(function(){

            function move(){
                console.log("Called");
                $("#block").animate({left:"+=50px" },1000).animate({top:"+=50px"},1000).animate({left:"-=20px"},1000).animate({top:"-=20px"});

            }

            window.setInterval(function(){
              move()
            }, 1000);
        })
    </script>


$（文档）.ready（函数（）{
函数move（）{
控制台日志（“调用”）；
$（“#块”）.animate（{left:+=50px}，1000）。animate（{top:+=50px}，1000）。animate（{left:+=20px}，1000）。animate（{top:+=20px}）；
}
setInterval（函数（）{
移动（）
}, 1000);
})

然后检查您的控制台，
在您可以使用的每一秒调用一个函数

<script type="text/javascript">
        $(document).ready(function(){

            function move(){
                console.log("Called");
                $("#block").animate({left:"+=50px" },1000).animate({top:"+=50px"},1000).animate({left:"-=20px"},1000).animate({top:"-=20px"});

            }

            window.setInterval(function(){
              move()
            }, 1000);
        })
    </script>


$（文档）.ready（函数（）{
函数move（）{
控制台日志（“调用”）；
$（“#块”）.animate（{left:+=50px}，1000）。animate（{top:+=50px}，1000）。animate（{left:+=20px}，1000）。animate（{top:+=20px}）；
}
setInterval（函数（）{
移动（）
}, 1000);
})

然后检查您的控制台，
您似乎根本不需要设置超时（）

假设您希望yoru动画反复循环和重复，正确的方法是使用
.animate（）
中的完成回调，而不使用
setTimeout（）
。您可以这样做：

$(document).ready(function(){

    function move(){
        $("#block").animate({left:"+=50px" },1000)
                   .animate({top:"+=50px"},1000)
                   .animate({left:"-=20px"},1000)
                   .animate({top:"-=20px"}, 1000, move);
    }
    // call it the first time
    move();
});

jQuery将自动为您排序这四个动画

你想知道的是最后一件事何时完成，这样你就可以重新开始整件事了。您可以使用上一次
.animate（）
操作中的completion函数再次调用
move（）
。因为这个回调被称为异步回调，所以在堆栈上没有堆栈构建或递归构建，并且可以永远愉快地运行


作为解释，您的
setTimeout（）
不起作用，因为当您将字符串作为第一个参数传递给
setTimeout（）
时，该字符串将在全局范围内求值，并且您在全局范围内没有
move（）
函数，因此找不到该字符串，并且不会执行任何操作。如果像在
setTimeout（move，1000）
中那样传递普通Javascript函数引用，那么函数引用将在当前作用域中求值（甚至在进行setTimeout调用之前），并且该函数引用被正确传递。您几乎不应该将字符串传递给
setTimeout（）
。这只是一个坏习惯，几乎总是应该避免的，而且总是可以避免的。但是，遗憾的是，这里似乎根本不需要
setTimeout（）


如果希望四个动画一个接一个地排序，然后在反复重复动画之前暂停1秒，可以执行以下操作：

$(document).ready(function(){

    function move(){
        $("#block").animate({left:"+=50px" },1000)
                   .animate({top:"+=50px"},1000)
                   .animate({left:"-=20px"},1000)
                   .animate({top:"-=20px"}, 1000, function() {
                       setTimeout(move, 1000);
                   });
    }
    // call it the first time
    move();
});

这里，一个匿名函数作为完成回调传递给最后一个动画。在该完成函数中，将运行
setTimeout（）
，该函数将在1000毫秒内再次调用
move

p.S.我注意到，您的动画不是对称的，因此它不会返回到它开始时的同一点，因此每次运行时，对象都会不断向右移动30像素，向下移动30像素。我不确定这是否是您想要的。
您似乎根本不需要设置超时（）

假设您希望yoru动画反复循环和重复，正确的方法是使用
.animate（）
中的完成回调，而不使用
setTimeout（）
。您可以这样做：

$(document).ready(function(){

    function move(){
        $("#block").animate({left:"+=50px" },1000)
                   .animate({top:"+=50px"},1000)
                   .animate({left:"-=20px"},1000)
                   .animate({top:"-=20px"}, 1000, move);
    }
    // call it the first time
    move();
});

jQuery将自动为您排序这四个动画

你想知道的是最后一件事何时完成，这样你就可以重新开始整件事了。您可以使用上一次
.animate（）
操作中的completion函数再次调用
move（）
。因为这个回调被称为异步回调，所以在堆栈上没有堆栈构建或递归构建，并且可以永远愉快地运行


作为解释，您的
setTimeout（）
不起作用，因为当您将字符串作为第一个参数传递给
setTimeout（）
时，该字符串将在全局范围内求值，并且您在全局范围内没有
move（）
函数，因此找不到该字符串，并且不会执行任何操作。如果像在
setTimeout（move，1000）
中那样传递普通Javascript函数引用，那么函数引用将在当前作用域中求值（甚至在进行setTimeout调用之前），并且该函数引用被正确传递。您几乎不应该将字符串传递给
setTimeout（）
。这只是一个坏习惯，几乎总是应该避免的，而且总是可以避免的。但是，遗憾的是，这里似乎根本不需要
setTimeout（）


如果希望四个动画一个接一个地排序，然后在反复重复动画之前暂停1秒，可以执行以下操作：

$(document).ready(function(){

    function move(){
        $("#block").animate({left:"+=50px" },1000)
                   .animate({top:"+=50px"},1000)
                   .animate({left:"-=20px"},1000)
                   .animate({top:"-=20px"}, 1000, function() {
                       setTimeout(move, 1000);
                   });
    }
    // call it the first time
    move();
});

这里，一个匿名函数作为完成回调传递给最后一个动画。在里面