为什么在画布上画线;t出现

Why drawing line on canvas doesn't appear?

本文关键字：出现 为什么      更新时间：2023-09-26

我使用html 5在画布上用按钮画一条线。

有人知道为什么吗

<!DOCTYPE html>
<html>
 <body onload="">
<canvas id="myCanvas" width="400" height="200" style="border:1px solid #000000;">
  Your browser does not support the HTML5 canvas tag.
</canvas>
<button name="draw" onclick="drawLine()">Draw Line</button>
<script type="text/javascript" src="canvashtml5.js" ></script>
</body>
</html>

darwLine函数在外部javascript上为canvasHtml5.js:

function drawLine(){
   var canvas = document.getElementById(myCanvas);
   var context = canvas.getContext("2d");
   context.moveTo(0,0);
   context.lineTo(300,150);
   context.stroke();
}
myCanvas
{
   var c=document.getElementById("myCanvas");
   var ctx=c.getContext("2d");
   ctx.fillStyle="#FFFF00";
   ctx.fillRect(0,0,150,75);
}

我忘了把myCanvas放在quot中，就像这样："myCanvas"。

this var canvas=document.getElementById（myCanvas）；必须与var canvas = document.getElementById("myCanvas"); 类似

替代方案：

在你的按钮上添加一个事件监听器，如下所示：

document.getElementById('drawLineBtn').addEventListener('click', drawLine, false);

这将减少你将来的工作。看见http://jsfiddle.net/kbXAN/23/

相关文章：