javascript - Perform Jquery Bind Synchronously -

i getting size of images in each() statement.

i binding function it's load event. although, need obtain images height before continuing code execution.

$(window).load(function () {        $("element").each( function() {             /*             .             .             .             .             */             var containerheight = $(this).height();             var imgheight = 0;              //get size of full image.             var imgload = $("<img />");             imgload.attr("src", imgsrc);             imgload.bind("load", function () { imgheight = this.height; });              heightdiff = (imgheight - containerheight);              //some methods called...             //imgheight still set 0       }); }); 

i considered using .trigger("custom-event")

and checking if called jquerys .when() method

but there easier (if not better) way in doing this?

regards,

the ever classic "how can return values asynchronous function" problem.

you can't, period. use callbacks.

$("element").each(function () {     var containerheight = $(this).height(),         imgsrc = "something";      $("<img />", { src: imgsrc })     .appendto("#whatever")     .on("load", function () {          var $img = $(this),             heightdiff = ($img.height() - containerheight);          //some methods called...     }); });