Question

我想在我的网页上画一个圆圈所以我已经下载了两个不同的javascript来绘制一个圆圈。一个js文件是从http://jsdraw2d.jsfiction.com/下载的然后我已经使用它的功能绘制圆圈但是圈子没有显示在我试过的html页面上互联网资源管理器和Mozilla Firefox，但它不会给出错误，也不会画圆圈那背后有什么共鸣呢。使用两个js文件时会出现相同的问题。

提前致谢

<HEAD>
 <TITLE> New Document </TITLE>
 <script type="text/javascript" src="wz_jsgraphics/wz_jsgraphics.js"></script>
 <script type="text/javascript">
 function myDrawFunction()
 {


      jg2.setColor("#0000ff"); // blue
      jg2.drawEllipse(10, 50, 230, 100);
      jg2.drawRect(400, 10, 100, 50);
      jg2.paint();
       alert("hi");
}
var jg2 = new jsGraphics(document.getElementById("canvas"));
</script>

<BODY >
<div id="canvas" style="overflow:hidden;position:relative;width:600px;height:300px;"></div> 
<input type="submit" onclick="myDrawFunction()" value="Click"> 
<p> hi this is paragraph</p>
</div>
</BODY>

Answer 1

您正在加载页面之前使用document.getElementById！

var jg2 = new jsGraphics(document.getElementById("canvas"));

解析后立即调用。

将其更改为：

var jg2 = null;
function myDrawFunction()
 {
    if(jg2 == null)
       jg2 = new jsGraphics(document.getElementById("canvas"));
    jg2.setColor("#0000ff"); // blue
    jg2.drawEllipse(10, 50, 230, 100);
    jg2.drawRect(400, 10, 100, 50);
    jg2.paint();
    alert("hi");
}

图纸不会显示在网页上

1 个答案: