<!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?height?=?document.myFrom.txtcount.value;
????var?c?=?document.getElementById("myCanvas");
????var?cxt?=?c.getContext("2d");
????
?????for(i?=?0;?i?<?height;?i++){
????????cxt.fillStyle="#FF0000";
????????cxt.fillRect(0,0+i*150,150,75);
????????
????????cxt.fillStyle="#ffffff";
????????cxt.beginPath();
????????cxt.arc(70,18+i*150,15,0,Math.PI*2,true);
????????cxt.closePath();
????????cxt.fill();
????}
}
</script>
</head>
<body>
<from?name?=?"myFrom">
????<input?type="text"?name="txtcount"/>
????<input?type="submit"?name?=?"Submit"?value="Go!"?/?onclick="block">
</from>
<canvas?id="myCanvas"?width="150"?style="border:1px?solid?#c3c3c3;">Your?browser?does?not?support?the?canvas?element.</canvas>
</body>
</html>
想要根據框中鍵入的數字在canvas中循環畫圖,不知道為什么循環不了呢?
qq_伽利略扭秤_0
2017-04-18 22:19:12