2016-11-12 70 views
0

當我嘗試在.html文件中查找類.galleryImage的所有對象時,一切正常,但是當我想將其放入script.js中時,我總是讀取可變圖像中的0個元素。無法將類對象加載到變量中

<div id="gallery"></div> 
<script> 
$(function(){ 
    for(var i = 1; i <= 8; i++){ 
    var name = 'picture' + i + '.jpg'; 
    var img =$('<img class="galleryImage" src="picture/'+name+'"/>'); 
    $('#gallery').append(img); 
    } 
    var images = $('#gallery').find('.galleryImage'); 
    console.log(images); 
}); 
    var g= new PS.Gallery('gallery'); 
</script> 

而且功能

(function (ns){ 
ns.Gallery = function(id){ 
    var gallery=$('#' + id); 
    console.log(gallery); 
    var images = gallery.find('.galleryImage'); 
    console.log(images); 
    images.each(function(idx,el){ 
    console.log('are u here?'); 
}); 
} 
}(window.PS = window.PS || {})); 
+0

不清楚哪個部分導致的問題。提供[mcve] – charlietfl

+0

@kubauser可以提供jsfiddle或codepen嗎? – HenryDev

+0

你把'''script src =「script.js」>'''放在html頁面的頂部,還是放在底部? –

回答

0

我想你會在這一步出現錯誤

變種G =新PS.Gallery( '畫廊');

改變你的js代碼序列這種

(function (ns){ 
     ns.Gallery = function(id){ 
      var gallery=$('#' + id); 
      console.log(gallery); 
      var images = gallery.find('.galleryImage'); 
      console.log(images); 
      images.each(function(idx,el){ 
       console.log('are u here?'); 
      }); 
     } 
    }(window.PS = window.PS || {})); 
    $(function(){ 
     for(var i = 1; i <= 8; i++){ 
      var name = 'picture' + i + '.jpg'; 
      var img =$('<img class="galleryImage" src="picture/'+name+'"/>'); 
      $('#gallery').append(img); 
     } 
     var images = $('#gallery').find('.galleryImage'); 
     console.log(images); 
    }); 

     var g= new PS.Gallery('gallery'); 

PS:檢查片段

(function (ns){ 
 
     ns.Gallery = function(id){ 
 
      var gallery=$('#' + id); 
 
      // console.log(gallery); 
 
      var images = gallery.find('.galleryImage'); 
 
      // console.log(images); 
 
      images.each(function(idx,el){ 
 
       //console.log('are u here?'); 
 
      }); 
 
     } 
 
    }(window.PS = window.PS || {})); 
 
    $(function(){ 
 
     for(var i = 1; i <= 8; i++){ 
 
      var name = 'picture' + i + '.jpg'; 
 
      var img =$('<img class="galleryImage" src="picture/'+name+'"/>'); 
 
      $('#gallery').append(img); 
 
     } 
 
     var images = $('#gallery').find('.galleryImage'); 
 
     console.log(images.length); 
 

 
    }); 
 
    var g= new PS.Gallery('gallery');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="gallery"></div>

這種改變一切如預期會工作後。這是因爲功能提升:函數聲明不只是提升函數的名字。它也提升了實際的功能定義。

希望這有助於