使用的Array.push

-1

HTML代碼沒有運行：使用的Array.push

<html> 
    <head> 
    <script>pushImages();</script> 
    <title>Float Image Gallery</title> 
    </head> 
    <body> 
    <button onclick="showAllGalleries();">Show gallery</button> 
    <div class="gallery"> 
     <div class="gallery-close"> 
     <a href=#><img class="gallery-close-button" src="http://bit.do/closeicon" onclick="hideAllGalleries();" /></a> 
     </div> 

     <div class="gallery-content"> 
     <!-- Whenever need to add a image, add this code : 
      <div class="gallery-image-cell"> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      </div> 
     --> 
     <!-- 
     Information : 
      When adding photo that is not 1:1, it will force shrink to 1:1. 
     --> 
     <div class="gallery-image-cell"> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
     </div> 
     <div class="gallery-image-cell"> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
      <img class="gallery-content-image" src="" alt="Please add image here" /> 
     </div> 
     </div> 

    </div> 
    </body> 
</html>

CSS：

<style> 
.gallery { 
    display:none; 
    width:100%; 
    height:100%; 
    left:0; 
    bottom:0; 
    top:auto; 
    right:auto; 
    position:fixed; 
    background-color:#cccccc; 
    opacity:50%; 
    overflow-y: scroll; 
} 

.gallery-close { 
    width:auto; 
    height:auto; 
    margin-top:10px; 
    margin-left:10px; 
} 

.gallery-close-button { 
    width:30px; 
    height:30px; 
} 

.gallery-content { 
    width:100%; 
    height:auto; 
    text-align:center; 
} 

.gallery-content-image { 
    width:20%; 
    height:100%; 
    opacity:0.6; 
    filter:alpha(opacity=60); 
} 

.gallery-content-image:hover { 
    background-color:#ffffff; 
    opacity:1.0; 
    filter:alpha(opacity=100); 
} 

.gallery-image-cell { 
    width: 100%; 
    height: 0; 
    padding-bottom: 20%; 
    margin-left: auto; 
    margin-right: auto; 
} 
</style>

的Javascript：

<script tyep="text/javascript"> 
function showAllGalleries(){ 
    var adsArray = document.getElementsByClassName("gallery"); 
    for (var i = 0; i<adsArray.length; i++){ 
    adsArray[i].style.display='inline'; 
    } 
} 

function hideAllGalleries(){ 
    var adsArray = document.getElementsByClassName("gallery"); 
    for (var i = 0; i<adsArray.length; i++){ 
    adsArray[i].style.display='none'; 
    } 
} 

function pushImages(){ 
    var imageArray = document.getElementsByClassName("gallery-content-image") 
    var imageLinkArray[]; 
    imageLinkArray.push("http://www.catchannel.com/images/feral-cats-birds.jpg"); 
    imageLinkArray.push("http://www.catchannel.com/images/orange-tabbies.jpg"); 
    imageLinkArray.push("http://thenypost.files.wordpress.com/2013/08/tiger132056-300x300.jpg"); 
    imageLinkArray.push("http://bioexpedition.com/wp-content/uploads/2012/06/Indochinese-Tiger-picture.jpg"); 
    imageLinkArray.push("http://www.east-northamptonshire.gov.uk/images/Dog_2.jpg"); 
    imageLinkArray.push("http://www.pet365.co.uk/product_images/r/008/dd_black_with_dog__41452_zoom.jpg"); 
    imageLinkArray.push("http://www.texasbirds.info/backyard/images/mountain_bluebird2_male.jpg"); 
    imageLinkArray.push("http://www.honolulumagazine.com/images/2013/Oct13/Print/Bird_Fairy.jpg"); 
    /*Use imageLinkArray.push("") to add a image; Add enough image.*/ 
    for (var i=0; i<imageArray.length; i++){ 
    imageArray[i].src = imageLinkArray[i]; 
    } 
} 
</script>

我不知道在哪裏問題是，但點擊按鈕後沒有任何事情發生。
請幫忙。任何幫助將不勝感激。謝謝。

來源

2014-04-05 Jamie

你缺少一個等號：'VAR imageLinkArray = [];' – ChaosPandion

什麼@null說，也使掉毛你的代碼的習慣 – shriek

<script>pushImages();</script>

這是在DOM甚至加載之前調用一個函數，這會在控制檯中拋出一個錯誤。將它放在代碼的底部或將其包裝在window.onload = function() { .... }中。

你也缺少在這一行等號：var imageLinkArray[];（應該是var imageLinkArray = [];

我也建議不要練內嵌腳本這是不好的做法，這樣做的嘗試添加一個事件處理程序的主體（。 onclick只支持一個事件處理程序）

document.getElementsByTagName("body")[0].addEventListener("load", showAllGalleries, false);

來源

2014-04-05 04:46:17

我認爲答案是在編輯之前就足夠了，檢查一下（不包括你的新編輯）：http：// cod epen.io/jamiechoi/full/zHpfo – Jamie

@ jfriend00在這種情況下，它會引用DOM元素，因此它會在頁面完全加載之前運行。 –

而7分鐘後接受你的答案，因爲15分鐘的限制，接受答案:) – Jamie

使用的Array.push

回答

相關問題