关于js在canvas中画图:为什么在浏览器中运行闪一下就没有了,canvas能根据画布中的东西调整大小么

  1. 怎样调整可以不闪?

  2. canvas能根据内容调整大小么?

  3. 怎样设置可以在重新输入之后点击go是重新画图,而不是现在这样的叠加?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>基本循环</title>

<script type="text/javascript">
function block(){
    var h = document.myForm.txtCount.value;
    
    var c = document.getElementById("myCanvas");
    var cxt = c.getContext("2d");
     for(i = 0; i <= h; i++){
        cxt.fillStyle="#FF0000";
        cxt.fillRect(0,0+i*100,150,75);
        
        cxt.fillStyle="#ffffff";
        cxt.beginPath();
        cxt.arc(70,15+i*100,10,0,Math.PI*2,true);
        cxt.closePath();
        cxt.fill();
    }
}
</script>
</head>

<body>

<form name = "myForm">
    <input type="text" name="txtCount"/>
    <input type="submit" name = "Submit" value="Go!" onclick="block()"/>
</form>

<canvas id="myCanvas" width="400"  height=4000 style="border:1px solid #c3c3c3;">Your browser does not support the canvas element.</canvas>

</body>

</html>

谢谢各位大神了!!!

qq_伽利略扭秤_0
浏览 2782回答 1
1回答
打开App,查看更多内容
随时随地看视频慕课网APP