如何獲得此功能對onclick方法作出反應？

這是按鈕，它當前將獲取畫布圖像並將該圖像顯示在另一個畫布上。如何獲得此功能對onclick方法作出反應？

var formElement2 = document.getElementById("recImage"); 
    formElement2.addEventListener('click', recImagePressed, false); 

    function recImagePressed(e){ 
     var outputCanvas = document.getElementById("outputCanvas"); 
     var recr = canvas2.toDataURL(); 
     outputCtx = outputCanvas.getContext('2d'); 
     outputCtx.drawImage(canvas2, 0, 0); 
     //context2.clearRect(0, 0, canvas2.width, canvas2.height);<----*** 
    } 

//***I need the image to clear when the user clicks, the above is wrong

，我需要在的onclick反應的功能是：（此功能已通過測試，如果我手動將巴新進功能工作）

function init() { <---------this will be done away with and replaced w/ 
           onClick ?? <-----------------**** 
canvas = document.getElementById('canVas'); 
ctx = canvas.getContext('2d'); 
draw(); 
} 

function draw() { <------This is the function that I need to react to mouse event 
img = new Image(); 
img.src = myPng.png ***---->This is where I need the canvas image<---------------*** 
fr1 = makeFrame(ctx, makeVect(400,0), makeVect(400, 0), makeVect(0, 400)); 
img.onload = function(){ 
    ctx.save(); 
    newPainter = cornerSplit(imagePainter,5); 
    newPainter(fr1);  
    ctx.restore(); 
    ctx.save(); 
    newPainter(flipHorizLeft(fr1)); 
    ctx.restore(); 
    ctx.save(); 
    newPainter(flipVertDown(fr1)); 
    ctx.restore(); 
    ctx.save(); 
    newPainter(flipVertDown(flipHorizLeft(fr1))); 
     } 
}

來源

2011-11-28 mcgraw

你能澄清一下你想？如果我認爲你想要你真正想要的東西，請看我的答案，但請不要低估，如果我誤解了，請。 – tekknolagi

@Tekknolagi ---->請原諒我在js的新生，我剛開始學習它。我需要刪除調用draw（）方法的init（）函數，並將該調用放在onclick方法中的draw（）中。我不知道如何準確地構建您的答案與我的實施，這是我堅持的地方。謝謝大家的迴應，我幾乎完成了這個項目，並且我一直在用最後一塊代碼敲打我的頭。 – mcgraw

，因爲它現在，我只能夠在一個頁面上創建一個畫布圖像，初始化我的繪畫畫布，將該圖像保存爲PNG，然後將該PNG放入處理圖像的draw（）方法。我需要上面的按鈕（formElement2）調用draw（）方法，然後顯示在「outputCanvas」 – mcgraw

formElement2.onclick = function(args, ...) { 

}

來源

2011-11-28 05:55:17 tekknolagi

如何獲得此功能對onclick方法作出反應？

回答

相關問題