帆布和IMG在鉻，但不是火狐工作

我已經搜索了關於這個問題的一些結果，但他們都沒有爲我工作，所以我張貼在這裏得到一些幫助。基本上我的問題是當我點擊生成按鈕時，我希望畫布上的圖像顯示在img元素中。但是，圖像將顯示在Chrome中，但不是Firefox！下面是我的編碼...帆布和IMG在鉻，但不是火狐工作

<body onload="onLoad();"> 
    <canvas id="aimage">Your browser does not support the canvas tag.</canvas> 
    <input type="button" value="Generate" onclick="genImage();" /> 
    <img id="cImg" name="cImg" src="${param.src}" /> 
... 
</body>

和JavaScript ...

var tcanvas; 
var scanvas; 
var tcontext; 
var imageURL; 

function onLoad() { 
    tcanvas = document.getElementById("aimage"); 
    tcontext = tcanvas.getContext("2d"); 
    scanvas = document.getElementById("cImg"); 
    imageURL = "${param.src}"; 
    update();     
} 

function update() { 
    var image = new Image(); 
    image.onload = function() { 
     if (image.width != tcanvas.width) 
      tcanvas.width = image.width; 
     if (image.height != tcanvas.height) 
      tcanvas.height = image.height; 
     tcontext.clearRect(0, 0, tcanvas.width, tcanvas.height); 
     tcontext.drawImage(image, 0, 0, tcanvas.width, tcanvas.height); 
    } 
    image.crossOrigin = 'anon'; 
    image.src = imageURL; 
} 

function genImage() { 
    var url = tcanvas.toDataURL("image/jpeg"); 
    scanvas.crossOrigin = 'anon'; 
    scanvas.src = url; 

    if(scanvas.width > 1000){ 
     scanvas.width = 1000; 
    } 
    if(scanvas.height > 1000){ 
     scanvas.height = 1000; 
    } 
}

來源

2013-10-18 Sky

試試這個：

var scanvas, tcontext, tcanvas; 
function genImage() { 
    var url = tcanvas.toDataURL("image/jpeg"); 
    scanvas.src = url; 
    if (scanvas.width > 1000) { 
     scanvas.width = 1000; 
    } 
    if (scanvas.height > 1000) { 
     scanvas.height = 1000; 
    } 
} 
window.onload = function() { 
    tcanvas = document.getElementById("aimage"); 
    tcontext = tcanvas.getContext("2d"); 
    scanvas = document.getElementById('cImg'); 
    var img = new Image(); 
    img.onload = function() { 
     tcontext.drawImage(img, 0, 0, img.width, img.height) 
    }; 
    img.src = "yourImage.jpg"; 
}

來源

2013-10-18 05:25:56 Rayon

謝謝，但它仍然沒有工作在Firefox太多。 – Sky

@Sky它對我很好。版本25 – Rayon

我正在使用ver24。我已經更新了我的編碼，與您的編碼非常相似，但仍然因爲某些未知原因而無法工作。我不知道如何調試，因爲它不會顯示任何錯誤。 – Sky

帆布和IMG在鉻，但不是火狐工作

回答

相關問題