Pass dynamische Parameter zu Callback-Funktion in einer Schleife

Question

Ich wollte einige jQuery Animatios dynamisch festlegen.

Der Code:

function anim(data) { 
    for (index in data) { 
     (function(){ 
      var props = {}; 
      props[data[index].property] = data[index].value; 
      data[index].elem.animate(
       props, 
       500, 
       function() { 
        data[index].callback(); 
       } 
      ); 
     })(); 
    } 
} 

var data =[ 
    { 
     elem: elem1, 
     property: 'prop1', 
     value: 'val1', 
     callback: function() { 
      console.log('callback1'); 
     } 
    }, 
    { 
     elem: elem2, 
     property: 'prop2', 
     value: 'val2', 
     callback: function() { 
      console.log('callback2'); 
     } 
    }, 
]; 
anim(data); 

Das Problem ist bindend Rückrufe. Wenn der Rückruf ausgelöst wird, ist data[index] im aktuellen Bereich nicht verfügbar. Kann mir jemand sagen, wie ich diese Rückruf-Funktion einstellen soll?

Answer 1

Hier haben Sie eine closure von Immediately-invoked function expression verwendet. Sie müssen als Parameter übergeben.

(function(dindex){ 
     var props = {}; 
     props[dindex.property] = dindex.value; 
     dindex.elem.animate(
      props, 
      500, 
      function() { 
       dindex.callback(); 
      } 
     ); 
})(data[index]); 

Answer 2

Sie mögen dies als Alternative können versuchen,

function anim(data) { 
    $.each(data, function(x,y){ 
     var props = {}; 
     props[y.property] =y.value; 
     y.elem.animate(
      props, 
      500, 
      function() { 
        y.callback(); 
      } 
     ); 
    }); 


}