javascript suppress error and continue in for loop -


i'm trying implement speedtest downloading 3 image files internet, , averaging time took load them. if there error whatever reason, want skip loading image , proceed next one. if error occurs on last image, want calculate average speed @ point , return caller.

right now, once error occurs (i deliberately changed url of image doesn't exist), won't go further. i've tried returning true .onerror function, no luck. suggestions?

     var images = [{             "url": 'http://<removed>250k.jpg?n=' + math.random(),             "size": 256000         }, {             "url": 'http://<removed>500k.jpg?n=' + math.random(),             "size": 512000         }, {             "url": '<removed>1000k.jpg?n=' + math.random(),             "size": 1024000         }     ];   function calculatebandwidth() {     var results = [];     (var = 0; < images.length; i++) {         var starttime, endtime;         var downloadsize = images[i].size;         var download = new image();         download.onload = function () {             endtime = (new date()).gettime();              var duration = (endtime - starttime) / 1000;             var bitsloaded = downloadsize * 8;              var speedbps = (bitsloaded / duration).tofixed(2);             var speedkbps = (speedbps / 1024).tofixed(2);             var speedmbps = (speedkbps / 1024).tofixed(2);              results.push(speedmbps);              //calculate average speed             if (results.length == 3) {                 var avg = (parsefloat(results[0]) + parsefloat(results[1]) + parsefloat(results[2])).tofixed(2);                 return avg;             }         }         download.onerror = function (e) {             console.log("failed load image!");             return true;         };         starttime = (new date()).gettime();         download.src = images[i].url;     } } 

i think you're not doing controlling process each event occurs. each onerror , onload tells process stopped, not should quit per se. initialize 1 image, doesn't load, maybe take note, otherwise continue.

the thing is, you same thing @ end of onload too. is, whatever measurements, move next or, if no more, run script cleans , reports or whatnot.

for instance:

var site = 'http://upload.wikimedia.org/',     imgs = [     'wikipedia/commons/6/6e/brandenburger_tor_2004.jpg',     'wikipedia/commons/a/ad/cegonha_alsaciana.jpg',     'wikipe/cegonha_alsaciana.jpg',     'wikipedia/commons/d/da/crayonlogs.jpg',     'wikipedia/commons/1/17/bobbahn_ep.jpg',     'wikipedia/commons/9/90/ds_citro%c3%abn.jpg',     'wikipedia/commons/f/f0/deutzfahr_ladewagen_k_7.39.jpg',     'wikipedia/commons/c/c7/denglersw-peach-faced-lovebird-20051026-1280x960.jpg',     'wikipedia/commons/4/4d/fa-18f_breaking_soundbarrier.jpg' ]; 

my array of images. hint, wikipe/cegonha_alsaciana.jpg won't load. forewarned, these large , load , use cache buster keep them firing onloads.

getimg(); 

in fiddle, within window.onload event handler, when gets called, initializes process. don't have setup phase, per se, or otherwise might have called init() or setup().

function getimg() {     var img = document.createelement('img'),         path = imgs.shift();      if (path) {         img.onload = loaded;         img.onerror = notloaded;         img.src = site + path + '?cach=bust' + math.floor(math.random() * 9999);          console.log('loading ', img.src);          document.body.appendchild(img);     } else {         console.log('finished loading images.');     }      function loaded(e) {         console.log('loaded ', e.target.src);         next();     }      function notloaded(e) {         console.log('not loaded ', e.target.src);         next();     }      function next() {         console.log(imgs.length, ' imgs left load.');         getimg();     } } 

http://jsfiddle.net/userdude/vftfp/

this you're trying do, without timing mechanism built-in. can break things off steps, actions , events, can control steps necessary. in basic way, script should not run differently.


Comments