首页 > 用prototype扩展Image()类不成功

用prototype扩展Image()类不成功

我想用prototype扩展Image()类,专门为预加载图片服务。
最初是这么实现的:

$scope.sh = 0;//最初为0,每加载一个图片加一,如果全部图片加载成功则sh=图片数量
preImage = function(/*str*/){
//    this.src = pwd+str;
};
preImage.prototype = new Image();
preImage.prototype.onload = function(){
    $scope.sh++;//每张图片load事件都会让sh加一
    $scope.$apply();
    alert($scope.sh,this.src);//调试用
};
preImage.prototype.corssOrigin = 'Anonymous';
coin = new preImage();
capture = new preImage();
coin.src = pwd+"images/coin.png";
capture.src = pwd+"images/capture.png";
gbg = new preImage();
gbg.src = pwd+"images/gbg.jpg";
camera = new preImage();
camera.src = pwd+"images/camera.png";
n1 = new preImage();
n1.src = pwd+"images/11.png";
n2 = new preImage();
n2.src = pwd+"images/12.png";
n3 = new preImage();
n3.src = pwd+"images/13.png";
bai = [new preImage(),new preImage()];
bai[0].src = pwd+"images/bai1.png";
bai[1].src = pwd+"images/bai2.png";
again = new preImage();
again.src = pwd + "images/again.png";
again.id = 'again';
info = new preImage();
info.src = pwd + "images/info-forward.jpg";
info.id = 'info';
arrow = new preImage();
arrow.src = pwd + "images/arrow-forward.png";
arrow.id = 'arrow';
score = new preImage();
score.src = pwd + "images/score.png";
score.id = 'score';

后来发现用preImage.prototype = new Image()会造成所有preImage的实例共用一个prototype,于是就改成了preImage.prototype = Image.prototype
但是这样一来我赋值的onload函数在预加载图片后都不执行了。
请问有没有可能实现这样的扩展呢?我是哪里做得有问题?


  1. 难道不应该是所有的preImage实例共用一个 prototype嘛?

  2. 至于你提到 “改成 preImage.prototype = Image.prototype” 后,就无法监听到图片的 onload 事件了,是因为 preImage.prototype.onload 重写了 Image.prototype.onload 的方法。

【热门文章】
【热门文章】