JavaScript 类未捕获类型错误

Question

我正在尝试构建一个 JavaScript 类，但我遇到了以下问题:
this.ctx.drawImage(img.src, 0, 0, img.width, img.height);

出现的错误信息是:Uncaught TypeError: Cannot call method 'drawImage' of undefined

function jraw(id){
    this.canvas = document.getElementById(id);
    this.ctx = this.canvas.getContext('2d');
    this.setImage = function(url){
        var img = new Image();
        img.src = url;
        img.onload = function(){
            this.ctx.drawImage(img.src, 0, 0, img.width, img.height);
        };
    };
}

然后我这样调用它:

<script>
    var j = new jraw("canvas");
    j.setImage("/images/my_image.jpg");
</script>

如何让 onload 访问 ctx 属性？我做了一些测试，它在 setImage 方法中看到了 ctx 属性，但在 onload 方法中看不到。

Answer 1

这是一个选项:

function jraw(id){
    this.canvas = document.getElementById(id);
    this.ctx = this.canvas.getContext('2d');
    var that = this;
    this.setImage = function(url){
        var img = new Image();
        img.src = url;
        img.onload = function(){
            that.ctx.drawImage(img, 0, 0, img.width, img.height);
        };
   };
}

虽然不一定是最好的。