首页 新闻 会员 周边

急!急!JS的图片绑定onload事件后全局变量报错未定义undefined

0
悬赏园豆:20 [待解决问题]
  1 $(function(){
  2 /*************初始化***************/
  3        var _img=[];//图片对象全局变量
  4 
  5     var adjustDiv=function(){//调整DIV宽度和高度
  6             var winHeight=$(window).height();
  7             var winWidth=$(window).width();
  8             $('#bgImgPPT2').css('height',winHeight);
  9             $('#bgImgPPT2').css('width',winWidth);
 10             //alert(winHeight+' and '+winWidth);
 11         }
 12     var adjustImg=function(_width,_height){//自动调整图片大小_width=>图片宽度,_height=>图片高度
 13             var winHeight=$(window).height();//窗口高度
 14             var winWidth=$(window).width();//窗口宽度
 15             
 16             //alert(_width+' and '+_height);
 17             
 18             var needH=winHeight+150;//实际需要的高度
 19             var needW=winWidth;//实际需要的宽度
 20             
 21             //alert(needH+' and '+needW);
 22             
 23             var _tempW=_width;//缓存宽度
 24             var _tempH=_height;//缓存高度
 25             
 26             var newWH=[];//需要返回的数组
 27         
 28             /**首先调整高度**/
 29             _tempH=needH;
 30             _tempW=(_tempH/_height)*_width;
 31     
 32             if(_tempW<=needW){//若宽度未达到,调整宽度,同时调整高度
 33                 var _tempW1=_tempW;
 34                 _tempW=needW;
 35                 _tempH=(_tempW/_tempW1)*_tempH;
 36                 }
 37             newWH['height']=_tempH;
 38             newWH['width']=_tempW;
 39             
 40             return newWH;
 41         }
 42         var initPpt=function(){//初始化,主要是获得pageCounter的pages参数
 43             $('#bgImgPPT2').html('');
 44            var imgArr=['img/test.jpg','img/test2.jpg','img/test3.jpg','img/test4.jpg','img/test5.jpg'];//图片数组
 45             //console.log(imgArr.length);
 46             /*********自动调整图片及DIV大小********/
 47                         adjustDiv();
 48                         //alert(imgArr[1]);
 49             /****图片预加载****/
 50                         /*for(var j=0;j<_img.length;j++){
 51                                 //alert(_img[j].src);
 52                                 var imgObj=_img[j];
 53                 imgObj.onload=function(){
 54                     var _width=imgObj.width;
 55                     var _height=imgObj.height;
 56                     _tempWH=adjustImg(_width,_height);                                               $('#bgImgPPT2').children('#index_'+j).attr('src',imgObj.src).width(_tempWH['width']).height(_tempWH['height']);
 57                     }
 58                 }*/
 59             for(var i=0;i<imgArr.length;i++){
 60                 _img[i]=new Image();
 61                 _img[i].src=imgArr[i];
 62                 $('#bgImgPPT2').append('<img id="index_'+i+'" src="img/loading.gif" class="zhanwei"/>');
 63                 $('#bgImgPPT2').children('#index_'+i).width($(window).width()).height($(window).height());
 64                 }
 65                     //console.log(_img.length);
 66             
 67             /****图片预加载****/
 68             /*********自动调整图片及DIV大小********/
 69         }
 70 /*************初始化**************/
 71 /****************幻灯片*********************/
 72         initPpt();//初始化
 73         /********/
 74         for(var i=0;i<_img.length;i++){
 75             alert(_img[i].src);//这里就可以获得_img这个全局变量的属性
 76             _img[i].onload=function(){//这里报错_img[i] undefined,这个到底是怎么回事了,该怎么解决呢?
 77                 var _width=_img[i].width;
 78                 var _height=_img[i].height;
 79                _tempWH=adjustImg(_width,_height);//获得调整后的尺寸
 80                _img[imgIndex].width=_tempWH['width'];
 81                _img[imgIndex].height=_tempWH['height'];
 82                $("#bgImgPPT2").children('#index_'+i).replaceWith(_img[i]);
 83                 }
 84             }
 85         /********/
 86         var ppt= '';
 87         var bgImgPPTLength = $("#bgImgPPT2").children("img").length;
 88         var imgIndex=0;
 89         function pptSwitch(){
 90             var bgImgPPT = $("#bgImgPPT2").children("img");
 91                         //console.log(_img[imgIndex]);
 92                         //alert(judgeLoad(_img[imgIndex]));
 93                         //alert(_img[imgIndex].complete);
 94                         //alert($(_img[imgIndex]).attr('src'));
 95             if(imgIndex%2==0){
 96                 if(imgIndex>=bgImgPPT.length-1){
 97                                         //console.log(_img.length);
 98                     bgImgPPT.eq(imgIndex).animate({'top':'-50px'},2500).fadeOut(250);
 99                     bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1);
100                     bgImgPPT.eq(0).fadeIn(250);
101                     //clearInterval(ppt);
102                     imgIndex=0
103                     /*ppt = setInterval(function(){
104                       pptSwitch(imgIndex);
105                     },3000);*/
106                 }else{
107                     bgImgPPT.eq(imgIndex).animate({'top':'-50px'},2000).fadeOut(250).next('img').fadeIn(250);
108                     bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1)
109                     imgIndex++;
110                 }
111             }else{
112                 if(imgIndex>=bgImgPPT.length-1){
113                     //console.log(imgIndex);
114                     bgImgPPT.eq(imgIndex).animate({'top':'-150px'},2000).fadeOut(250)
115                     bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1)
116                     bgImgPPT.eq(0).fadeIn(250);
117                     //clearInterval(ppt);
118                     imgIndex=0;
119                     /*ppt = setInterval(function(){
120                       pptSwitch(imgIndex);
121                     },3000);*/
122                 }else{
123                     bgImgPPT.eq(imgIndex).animate({'top':'-150px'},2000).fadeOut(250).next('img').fadeIn(250)
124                     bgImgPPT.eq(imgIndex).animate({'top':'-100px'},1)
125                     imgIndex++;
126                 }
127             }
128         }
129 /******************幻灯片******************/
130 /************************自动执行**************************/
131         ppt = setInterval(function(){
132                   pptSwitch();
133         },2500);
134 /************************自动执行************************/
135 });

 

代码如上,_img[i]显示undefined,请高手指点并给出解决方法,不胜感激!

八面碰壁居士的主页 八面碰壁居士 | 初学一级 | 园豆:182
提问于:2012-04-18 22:22
< >
分享
所有回答(2)
0

检查地址是否正确,另外所有浏览器下都报错吗:解决IE中img.onload失效的方法,看看是否是这个原因

artwl | 园豆:16736 (专家六级) | 2012-04-18 22:49
1

你这个地方写的有问题

for(var i=0;i<_img.length;i++){
 75             alert(_img[i].src);//这里就可以获得_img这个全局变量的属性
 76             _img[i].onload=function(){//这里报错_img[i] undefined,这个到底是怎么回事了,该怎么解决呢?
 77                 var _width=_img[i].width;
 78                 var _height=_img[i].height;
 79                _tempWH=adjustImg(_width,_height);//获得调整后的尺寸
 80                _img[imgIndex].width=_tempWH['width'];
 81                _img[imgIndex].height=_tempWH['height'];
 82                $("#bgImgPPT2").children('#index_'+i).replaceWith(_img[i]);
 83                 }
 84             }

把上面这段代码改为:

for(var i=0;i<_img.length;i++){
             //alert(_img[i].src);//这里就可以获得_img这个全局变量的属性
             _img[i].onload=(function(){//这里报错_img[i] undefined,这个到底是怎么回事了,该怎么解决呢?
             console.log( _img[i].src);
                 var _width=_img[i].width;
                 var _height=_img[i].height;
                _tempWH=adjustImg(_width,_height);//获得调整后的尺寸
                _img[imgIndex].width=_tempWH['width'];
                _img[imgIndex].height=_tempWH['height'];
                $("#bgImgPPT2").children('#index_'+i).replaceWith(_img[i]);
                 })();
             }

for循环是没有块的作用,需要让函数立即执行才可以;估计我来晚了,没有解你燃眉之急

人 在 旅 途 | 园豆:315 (菜鸟二级) | 2012-04-24 13:53

基本如此啊。

支持(0) 反对(0) icepy | 园豆:587 (小虾三级) | 2012-05-16 13:23
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册