Javascript 如何停止画布中的动画？

我有以下代码来启动动画：

function anim()
{
    mouse_x=cursor_x-x;
    mouse_y=cursor_y-y;
    context.fillRect(0,0,w,h);
    for(var i=0;i<n;i++)
        {
        test=true;
        star_x_save=star[i][3];
        star_y_save=star[i][4];
        star[i][0]+=mouse_x>>4; if(star[i][0]>x<<1) {star[i][0]-=w<<1; test=false; }
        if(star[i][0]<-x<<1) { star[i][0]+=w<<1; test=false; }
        star[i][1]+=mouse_y>>4; if(star[i][1]>y<<1) { star[i][1]-=h<<1; test=false; }
        if(star[i][1]<-y<<1) { star[i][1]+=h<<1; test=false; }
        star[i][2]-=star_speed; if(star[i][2]>z) { star[i][2]-=z; test=false; }
        if(star[i][2]<0) { star[i][2]+=z; test=false; }
        star[i][3]=x+(star[i][0]/star[i][2])*star_ratio;
        star[i][4]=y+(star[i][1]/star[i][2])*star_ratio;
        if(star_x_save>0&&star_x_save<w&&star_y_save>0&&star_y_save<h&&test)
            {
            context.lineWidth=(1-star_color_ratio*star[i][2])*2;
            context.beginPath();
            context.moveTo(star_x_save,star_y_save);
            context.lineTo(star[i][3],star[i][4]);
            context.stroke();
            context.closePath();
            }
        }
    timeout=setTimeout('anim()',fps);
    }

---

您可以使用函数anim（）重新定义函数{}；虽然我不知道你为什么要做这样的事

但是根据你的问题，我推测你想破坏画布上的结果图像。唯一的方法是将画布重置为其开始或以前的保存状态。像这样：

重置：

context.clearRect（0,0，canvas.width，canvas.height）

保存和还原：
要告诉垃圾收集器释放
上下文
内存，只需将其引用变量设置为null

context=null;

在将上下文设置为null之前，必须停止动画，可以执行以下操作：

创建一个布尔标志，指示是否应执行任何未来动画：

// allow anim to do its animations
var doAnim=true;

然后，在动画循环中，如果标志指示“停止”，您只需返回，而不执行动画代码：

function anim(){
    if(!doAnim){context=null; return;}
    ...
}

要停止动画，只需将标志设置为“停止”：

然后，如果以后要重新启动动画制作，只需重置标志并调用
anim
即可开始动画制作

var context=...
doAnim=true;
anim();

我打算这样，当有人打开我的网站，但动画画布侵入。然后有一个按钮关闭动画。嗯，不工作，我用恢复工作！！但是如何去除星星呢？因为当停止的时候。明星也停了下来。我想创建一个干净的画布您可以使用
if（！doAnim）{context.clearRect（0,0，context.canvas.width，context.canvas.height）；context=null；return；}
祝您的项目好运！：-）
doAnim=false;

var context=...
doAnim=true;
anim();