负荷远程图像，然后选择添加到阵列

使用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

负荷远程图像，然后选择添加到阵列

回答

相关问题