javascript - JS : Why isn't this variable available to the other functions?

Question

我正在尝试制作 Canvas 动画:

var context;
var meter;
var pin;

function init() {
    var meter = new Image();
    var pin = new Image();
    var context = document.getElementById('canvas').getContext('2d');
    meter.src = 'background.png';
    pin.src = 'needle.png';
    context.drawImage(meter,0,0);
    context.translate(275,297);
    context.save();
    setTimeout(startup,500);
}

function startup() {
    var r=2;    // set rpm here.
    var i=r*36-27;
    var angleInRadians = 3.14159265 * i/180;  //converting degree to radian                
    context.rotate(angleInRadians); //rotating by angle
    context.drawImage(pin,-250,-3);  //adjusting pin center at meter center
    context.restore();
}

您可以在http://www.kingoslo.com/instruments/处看到该脚本

使用 firebug，我收到错误消息，提示上下文未定义，我认为这很奇怪。

谢谢。

亲切的问候， 马吕斯

Answer 1

这可能是因为您在 init() 函数内使用“var”，这使得新的“上下文”变量成为该函数的本地变量，而不是向全局变量添加定义。因此，只需在 init() 函数中的“context”之前删除“var”，它就应该可以工作。您也应该将 var 放在 Meter 和 Pin 前面。