負荷遠程圖像，然後選擇添加到陣列

使用JavaScript我想不加載當前頁面上的圖像（從圖像鏈接的陣列），如果他們足夠大，把它們添加到一個數組。我在當前頁面加載後執行此操作，雖然是一個小書籤或螢火蟲控制檯。使用FF。負荷遠程圖像，然後選擇添加到陣列

最近我來了下面，但這似乎並沒有工作，我猜這是因爲大小測試在圖像加載之前運行。顯然，我試圖用'onload'來解決這個問題並不成功。我該如何解決這個問題，還是有更好/更簡單的方法來完成這項任務？

(function() { 

    //create array for the images 
    var imageArray = new Array(); 


    function loadIfBig(x){ 
      if (x.height > 299 && x.width > 299 && (x.height > 399 || x.width > 399)) { 
       imageArray.push(x); 
       //dispImage = '<img src=' + x.src + '><br>'; 
       //document.write('<center>' + dispImage + '</center>'); 
      } 
     return true; 
    } 


    //given an array of imageLinks: 
    for (x in imageLinks){ 
    //create an image form link and add to array if big enough 
     im = document.createElement('img'); 
     im.src = imageLinks[x]; 
     im.onload = loadIfBig(im); 
    } 

    //view results: 

    for (x in imageArray){ 
     disp_image = '<img src='+imageArray[x].src+'><br>'; 
     document.write('<center>'+disp_image+'</center>'); 
    } 


})();

更新：

謝謝！確定你是對的，我在這裏錯過了一些愚蠢的東西，但我做了你所建議的改變，然後把這些元素寫入loadIfBig，但它似乎並沒有執行那個功能。下面當前的代碼，其中包括一對夫婦的樣本輸入鏈接：

(function() { 
    var imageArray = new Array(); 

    var imageLinks = ['http://1.bp.blogspot.com/_mfMRTBDpgkM/SwCwu1RPphI/AAAAAAAAJpw/v9YInFBW84I/s1600/800px-San_Francisco_in_ruin_edit2.jpg','http://2.bp.blogspot.com/_mfMRTBDpgkM/SwCwulSZ_yI/AAAAAAAAJpo/NsRcJdpz4Dk/s1600/San_Francisco_PC_59.jpg'] 

    function loadIfBig(x){ 
      if (x.height > 299 && x.width > 299 && (x.height > 399 || x.width > 399)) { 
       imageArray.push(x); 
       dispImage = '<img src=' + x.src + '><br>'; 
       document.write('<center>' + dispImage + '</center>'); 
      } 
      return true; 
    } 
    processImages = function(){ 
     for (x in imageLinks) { 
      //create an image from link and add to array if big enough 
      im = document.createElement('img'); 
      im.src = imageLinks[x]; 
      im.onload = function(){ 
       loadIfBig(this); 
      } 
     } 

    }  
})();

來源

2010-06-27 Red Collar

，因爲你實際上是立即執行它你修復不起作用。

im.onload = loadIfBig(im)實際上是運行的功能。

你可以做的是一樣的東西：

im.onload = function() { 
     loadIfBig(this); 
    }

的另一個問題是，你通過大圖像陣列運行的onload回調實際上已經執行前的事實。這需要停留在一個不同的功能，並在所有的onloads完成後調用。

來源

2010-06-27 01:12:40

@kiamlaluno是的，我意識到，通過我的一個編輯中途。謝謝 – 2010-06-27 01:19:50

謝謝。試圖納入你的建議，但似乎並不奏效。（見更新）對不起，如果我在這裏密集。 – 2010-06-27 02:30:49

是'processImages'事情並不需要是一個功能。您可以立即執行該部分。完成所有工作後，應該可以正常工作。（現在的樣子，processImages永遠不會執行） – 2010-06-27 04:22:54

負荷遠程圖像，然後選擇添加到陣列

回答

相關問題