我正在尝试构建一个JavaScript类,并且在此行中遇到了问题:
this.ctx.drawImage(img.src, 0, 0, img.width, img.height);

出现的错误消息是:未捕获的TypeError:无法调用未定义的方法'drawImage'

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方法中却没有。

最佳答案

尝试

this.setImage = function(url){
    var that = this;
    var img = new Image();
    img.src = url;
    img.onload = function(){
        that.ctx.drawImage(img, 0, 0, img.width, img.height);
    };
};


同样,.drawImage()的第一个参数是图像对象,而不是url

演示:Fiddle

关于javascript - JavaScript类未捕获的TypeError,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/16158947/

10-12 12:46
查看更多