jQuery推遲不工作鉻和Safari瀏覽器？

Question

我想要drawImage放在畫布標籤上，然後再次保存。我使用jQuery的deferred.done()。

這裏是我使用的代碼：

function save_submit() { 
    LoadDraw().done(function(){ 
     var canvas = document.getElementById('touchpaint'); 
     var ctx = canvas.getContext('2d'); 
     var image = canvas.toDataURL(); 
    }); 
var LoadDraw = function() { 
    var r = $.Deferred(); 
    var canvas = document.getElementById('touchpaint'); 
    var ctx = canvas.getContext('2d'); 
    var imageLoader = 'http://img262.imageshack.us/img262/3453/gokum.jpg'; 
    var img = new Image(); 
    $(img).load(function(){ 
     ctx.globalCompositeOperation = "destination-over"; 
     ctx.drawImage(img,0,0); 
    }); 
    img.crossOrigin = ''; 
    img.src = imageLoader;  
    r.resolve(); 
    return r; 
    } 

它工作正常的Firefox。但在Chrome和Safari上不起作用。我正在尋求幫助。謝謝。

Answer 1

那麼，你沒有正確使用Deferred。 Deferred對象的想法是在某種回調函數中解析它，而不是在創建它之後「直接」解析它。

在你的情況，你可能應該解決在$（IMG）.load回調函數的延遲（R）：

var LoadDraw = function() { 
    var r = $.Deferred(); 
    var canvas = document.getElementById('touchpaint'); 
    var ctx = canvas.getContext('2d'); 
    var imageLoader = 'http://img262.imageshack.us/img262/3453/gokum.jpg'; 
    var img = new Image(); 
    $(img).load(function(){ 
     ctx.globalCompositeOperation = "destination-over"; 
     ctx.drawImage(img,0,0); 
     r.resolve(); 
    }); 
    img.crossOrigin = ''; 
    img.src = imageLoader;  

    return r; 
    }