Javascript wait for image to load before calling Ajax

Question

function dropResource() {

    var imgIndex = getImageIndexByID(currentDragImageID);
    var newImgID = resourceData.length;

    // Create the image
    $(\'#thePage\')         


        

Answer 1

When you set the src property the browser starts to download the image immediately. You have to define a load event prior to that at insert you post-load code inside it:

$('').load(function() {

    // you can do things here, after the image loads
    var imgW = $(this).width();
    var imgH = $(this).height();
    // ...

}).appendTo('#thePage').attr('src',uploadFolder + '/' + imgData[imgIndex][1]);