<img id="img1" mysrc="http://pic002.cnblogs.com/images/2012/319713/2012103021492628.jpg" width="200" height="248" src="img/tran.gif" style="background:url(img/loading.gif) no-repeat center #CCC;" />
<img id="img2" mysrc="http://pic002.cnblogs.com/images/2012/319713/2012103021500686.jpg" width="200" height="248" src="img/tran.gif" style="background:url(img/loading.gif) no-repeat center #CCC;"/>
<img id="img3" mysrc="http://pic002.cnblogs.com/images/2012/319713/2012103021504340.jpg" width="200" height="248" src="img/tran.gif" style="background:url(img/loading.gif) no-repeat center #CCC;"/>
<script type="text/javascript">
var Forimgload = function(opat){
    this.opat = opat;
    }
Forimgload.prototype = {
    loadimgs:function(){        //多张图的加载
        var _this = this,
            _imgurl = _this.opat.imgurl,
            _callback = _this.opat.callback,
            _pand = [],
            _imgload = _this.imgload;
        for(var i=0,j=_imgurl.length;i<j;i++){
            _imgload(_imgurl[i],function(){
                _pand.push(1);
                });
            }
        setTimeout(function(){
            if(_pand.length<j){
                setTimeout(arguments.callee,0);
                return;
                }
            _callback();
            _pand = null;
            _callback = null;
            },0)
        },
    loadimg:function(){          //单张图的加载
         var _this = this,
             _url = _this.opat.imgurl,
             _callback = _this.opat.callback,
             _imgload = _this.imgload;
         _imgload(_url,_callback);
         },
    oneload:function(url,callback){
        var _this = this;
        if(!_this.oneimg) _this.oneimg = new Image();
        var _other = new Image();
        var _one = _this.oneimg;
        _one.src = url;
        _other.src = url;
        if(_other.complete == false){
            _one.onload = function(){
              callback();
              }
            }else{
            callback();
            }
        console.log("loadind");
        },
    imgload:function(url,callback){    //主加载函数
        var _img = new Image();
        _img.src = url;
        if(_img.complete == false){
            _img.onload = function(){
                callback();
                callback = null;
                };
            }else{
            callback();
            }
        }
    }
/*new Forimgload({
        imgurl:["http://pic002.cnblogs.com/images/2012/319713/2012103021492628.jpg","http://pic002.cnblogs.com/images/2012/319713/2012103021492628.jpg"],
        callback:function(){
            alert("完成")
            }
        }).loadimgs();
*/
/*var imgs = document.getElementsByTagName("img");
var arri
for(var i=0,j=imgs.length;i<j;i++){
    new Forimgload({
        imgurl:imgs[i].src,
        callback:function(){
            console.log("1");
            }
        }).loadimg();
    }
*/

var but = document.getElementsByTagName("img");
var d = new Forimgload();
for(var i=0,j=but.length;i<j;i++){
    but[i].onclick = function(){
        var _src = this.getAttribute("mysrc");
        var _this = this;
        d.oneload(_src,function(){
            alert(1);
            _this.src = _src;
            });
        }
    }

</script>
posted on 2012-10-31 23:11  somesayss  阅读(1355)  评论(0编辑  收藏  举报