Come ordinare ricerche simultanee di immagini google in ordine di esecuzione?

Question

Ciao a tutti, non sono sicuro di come affrontare questo problema. Ho una funzione a cui viene passata una matrice di elementi img HTML. Passa attraverso queste immagini controllando l'attributo SRC per le immagini usando uno spazio vuoto "nessuna immagine" chiodo per il pollice. Quindi esegue una ricerca di immagini utilizzando l'attributo ALT tag img come query. La funzione di callback nella ricerca sostituisce quindi Img SRC con il risultato della prima immagine.

Sto riscontrando problemi nel far corrispondere l'immagine corretta con il callback di ricerca corrispondente. In questo momento sto solo creando array e abbinando la ricerca restituita con un indice per le immagini. Poiché le ricerche multiple vengono eseguite contemporaneamente, a seconda delle dimensioni dell'immagine o della latenza della rete, possono richiamare la chiamata fuori servizio e confondere le immagini.

Ho bisogno di un approccio che mi permetta di associare singole ricerche a elementi html. Questo sarebbe possibile utilizzando un searchController e più oggetti imageSearch?

Di seguito è riportato un esempio della funzione che sto utilizzando

google.load('search', '1');

function googleFillBlanks(jqueryImages){

  //namePairs holds the images matching alt text and attachedCount is used for matching up once the call back is fired
  var attachedCount = 0;
  var namePairs = [];

  function searchComplete(searcher){
    if (searcher.results && searcher.results.length > 0) {
       var results = searcher.results;
       var result = results[0];
       $("img[alt='"+namePairs[attachedCount]+"'] ").attr('src', result.tbUrl);
       //jqueryImages.get(0).attr('src', result.tbUrl);
       attachedCount++;
    }
  }

   var imageSearch = new google.search.ImageSearch();

    //restrict image size
    imageSearch.setRestriction(google.search.ImageSearch.RESTRICT_IMAGESIZE,
                               google.search.ImageSearch.IMAGESIZE_SMALL);

    imageSearch.setSearchCompleteCallback(this, searchComplete, [imageSearch]);

  jqueryImages.each(function(){
    if($(this).attr('src').substr(-12,8) == 'no_image')
    { 
      namePairs.push($(this).attr('alt'));
      imageSearch.execute($(this).attr('alt'));
    }
  });
}

Answer 1

questo è quello che ho finito per fare in modo che chiunque fosse interessato e per ricordare se stesso

google.load('search','1');
function checkImages(){

 // Here is the closure!
 var myClosure = function(img){return function(){
  if(this.results&&this.results.length>0){
   var result = this.results[0];
   img.src = result.tbUrl;
   img.alt = result.titleNoFormatting;
  }
 }};

 var imgs = document.getElementsByTagName('img');
 for(var i=0;i<imgs.length;i++){
  var img=imgs[i];
  if(img.src.match(/no_image.{4}/)){
   var is = new google.search.ImageSearch();
   is.setSearchCompleteCallback(is, myClosure(img));
   is.execute(img.alt);
  }
 }
}
google.setOnLoadCallback(checkImages);