2014-05-13 35 views
0

我正在嘗試製作一個非常簡單的meme生成器,從而使用下拉菜單選擇要添加文本的圖像。我可以成功地選擇我想要的圖像並將其顯示在畫布中,但是當我更改我的選擇時,而不是更改圖像將它添加到第一張圖像上。取代canvs中的圖像 - javascript

我希望能夠選擇圖像,如果我改變主意,它會簡單地替換當前圖像。任何建議,你可能會非常歡迎!

這裏是我的代碼:

window.onload = function init(){ 

var selector = document.getElementById('selector');  
var canvas = document.getElementById('canvas'); 
var context = canvas.getContext('2d'); 
var imageObj = new Image(); 
var imagesObj = { 
    "fry"  : ['images/fry.jpg'], 
    "badluck" : ['images/badluck.jpg'], 
    "success" : ['images/success.jpg'] 

}; 


selector.addEventListener('change', function(){ 
    imagesObj[selector.value].forEach(function(item){ 
    imageObj.onload = function() { 
    context.drawImage(imageObj, 0, 0); 
    }; 
    imageObj.src = item; 


}); 
}); 
} 

回答

0

它看起來像這樣的伎倆:

context.clearRect(0, 0, 298, 350);