未出现在画布中的图像

问题描述：

我目前正在创建或至少尝试创建一个非常简单的画布元素。您应该可以选择2张图像中的1张。当你点击两个图像中的一个时，它应该出现在画布上？但我不能让它工作？未出现在画布中的图像

我确定这些图像是正确命名的。

有人能帮助我吗？

<script> 
var canvas = document.getElementById("mijnCanvas"); 
var context = canvas.getContext("2d"); 
var welkBestek = document.getElementById("fotos"); 

var tafelkleedKleur="#ff0000"; 
function tekenAlles(){ 
      context.beginPath(); 
      context.rect(0,0,canvas.width,canvas.height); 

      //bord 
      context.drawImage(bordPlaatje,0,25); 

      //bestek 
      if(welkBestek == "mesvork") { 
       context.drawImage(mesvorkPlaatje,0,25); 
      } 
      else if (welkBestek == "stokjes") { 
       context.drawImage(stokjesPlaatje,0,25); 
      } 
} 

window.onload = function() { 
tekenAlles(); 
} 

function verander() { 
    tafelkleedKleur = document.getElementById("tafelkleed").value; 
    tekenAlles(); 
} 

var bordPlaatje = new Image(); 
bordPlaatje.src='bord.png'; 

var mesvorkPlaatje = new Image(); 
mesvorkPlaatje.src='img/afbeelding1.jpg'; 

var stokjesPlaatje = new Image(); 
stokjesPlaatje.src='img/afbeelding2.jpg'; 
</script> 
</div> 
<div class="footer"> 
</div>

这个答案显示很少或没有研究工作。请通过jsfiddle或类似方式在网络上创建一个工作示例，并尝试验证图像是否正确链接。 –

下一次，PLZ不会将代码翻译为荷兰语。只有少数人懂荷兰语。总是用英文编码，这样你就可以分享代码，就像这里@ SO ... –

答

根据您的代码示例脚本查找图片bord.jpg是在同一文件夹作为HTML

var bordPlaatje = new Image(); 
bordPlaatje.src='bord.png';

虽然mesvorkPlaatje & stokjesPlaatje作为一个子文件夹引用。

var mesvorkPlaatje = new Image(); 
mesvorkPlaatje.src='img/afbeelding1.jpg'; 

var stokjesPlaatje = new Image(); 
stokjesPlaatje.src='img/afbeelding2.jpg';

你有一个子文件夹img /？是可用的图像？

ps：试着在你的代码中使用英文，我做了同样的错误@开始，虽然它对你来说合乎逻辑，但并不意味着它对你的代码工作的另一个人是合乎逻辑的。

未出现在画布中的图像

相关推荐