jquery。然后不等待功能完成

我有一个半复杂的承诺链需要按照一定的顺序发生。作为承诺链一部分的功能之一是在它从另一个功能解决之前返回承诺。例如：jquery。然后不等待功能完成

this.triOverlay = new Image(); 
this.triOverlayFinal = new Image(); 

//Start the promise chain for overlay stuff 
$.when($.loadImage(this.triOverlay, 'art/small.png'), this.loadAgentImages()).then(function() { 
    console.log(">>> ALL DONE!!!! <<<<"); 
});

的LoadImage是一个简单的jQuery函数，建立一个延迟对象，并设置它为图像加载和处理：

$.loadImage = function (image, url) { 
    // Define a "worker" function that should eventually resolve or reject the deferred object. 
    var loadImage = function (deferred) { 

     image.onload = loaded; 
     image.onerror = errored; // URL returns 404, etc 
     image.onabort = errored; // IE may call this if user clicks "Stop" 

     image.src = url; 

     function loaded() { 
      unbindEvents(); 
      console.log(">>>>> resolved image! URL: "); 
      deferred.resolve(image); 
     } 
     function errored() { 
      unbindEvents(); 
      deferred.reject(image); 
     } 
     function unbindEvents() { 
      // Ensures the event callbacks only get called once. 
      image.onload = null; 
      image.onerror = null; 
      image.onabort = null; 
     } 
    }; 
    return $.Deferred(loadImage).promise(); 
};

它变得复杂的是，在loadAgentImages我有另一组

CubePan.prototype.loadAgentImages = function() { 

    var largePhotoPath = 'someURL'; //Just an example 
    var smallPhotoPath = 'someURL2'; //Just an example 

    //This cubePan 
    var me = this; 

    return $.when($.loadImage(this.agent.photo, smallPhotoPath), $.loadImage(this.agent.blurAgentPhoto, largePhotoPath)).then(function() { 
     //return deferred.promise(); 
     console.log(">>>> before start on bluid blur and build TriOverlay <<<<"); 
     return buildBlur(me); 
     //return blur; 
    }, function() { console.log(">>>> blur rejected <<<<"); }); 
};

的原始图像和CAL：需要装载需要发生一次，那些被加载的条款图像l到loadAgentImages是在同一个对象中。我知道我没有包括上述内容。

一旦两个图像已在得到解决的时候，当时的触发正确，它调用buildBlur（我）：

function buildBlur(me) { 
    console.log(">>>> buildBlur <<<<"); 
    var blurCanvas = document.createElement('canvas'); 
    var blurCTX = blurCanvas.getContext('2d'); 
    blurCanvas.height = me.agent.blurAgentPhoto.height; 
    blurCanvas.width = me.agent.blurAgentPhoto.width; 
    blurCTX.drawImage(me.agent.blurAgentPhoto, 0, 0, blurCanvas.width, blurCanvas.height); 

    //This function can be found in stackBlur.js 
    boxBlurCanvasRGBA(blurCanvas, 0, 0, blurCanvas.width, blurCanvas.height, 20); 
    return $.loadImage(me.agent.blurAgentPhotoFinal, blurCanvas.toDataURL('image/png', 1.0)); 

};

然而，BuildBlur不返回的承诺一旦其解决其返回它马上。尽管最终图像（blurAgentPhotoFinal）尚未加载并解决，但让其余部分认为已解决。

$ .loadImage可以在上面的所有实例中工作，而不是在buildBlur实例中。

任何想法为什么它不等待buildBlur中的$ .loadImage在完全解析链之前完成？

谢谢！

来源

2017-07-05 littlevahn

发现问题。该代码使用了jquery的一个非常旧的版本。 1.7。当升级到最新的。然后开始正常工作。

来源

2017-07-05 22:43:00 littlevahn

jquery。然后不等待功能完成

回答

相关问题