海葵不出来
JavaScript编译时Chrome报告Uncaught TypeError: undefined is not a function错误,
JavaScript编译时Chrome报告Uncaught TypeError: undefined is not a function错误,
2016-11-24
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>tinyHeart</title>
<style type="text/css">
body {
padding-top: 10px;
}
.all_bg{
width: 800px;
height: 600px;
margin: 0px auto;
}
#allcanvas{
position: relative;
width: 800px;
height: 600px;
margin: 0px;
}
#canvas1{
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
}
#canvas2{
position: absolute;
bottom: 0;
left: 0;
z-index: 0;
}
</style>
</head>
<body>
<div class = "all_bg">
<div id="allcanvas">
<canvas id ="canvas1" width ="800" height ="600"></canvas>
<canvas id ="canvas2" width ="800" height ="600"></canvas>
</div>
</div>
<script type="text/javascript" src = "js/main.js"></script>
<script type="text/javascript" src = "js/commonFunctions.js"></script>
<script type="text/javascript" src = "js/background.js"></script>
<script type="text/javascript" src = "js/ane.js">
</script>
</body>
</html>
var aneObj = function()
{
this.x = [];
this.len = [];
}
aneObj.prototype.num = 50;
aneObj.prototype.init = function()
{
for (var i = 0; i< this.num; i++)
{
this.x[i] = i * 20 + Math.random()*20;//[0,1)
this.len[i] = 200+Math.random()*50;
}
}
aneObj.prototype.draw = function()
{
for(var i=0 ;i<this.num; i++)
{
//beginPath,moveto,LineTo,stroke,strokestyle,LineWidth,LineCap,globleAlpha
ctx2.beginPath();
ctx2.moveto(this.x[i],600);
ctx2.lineTo(this.x[i],600 - this.len[i]);
ctx2.lineWidth = 20;
ctx2.lineCap = "round";
ctx2.strokestyle = "purple";
ctx2.stroke();
}
}
var can1;
var can2;
var ctx1;
var ctx2;
var canWidth;
var canHeight;
var lastTime;
var deltaTime;
var bgPic = new Image();
var ane;
document.body.onload = game;/*body 加载完后把game作为所有js脚本的入口*/
function game()
{
init();//console.log("onload");//输出普通信息
lastTime = Date.now();
deltaTime = 0;
gameloop();
}
function init()
{
//获得canvas context
can1 = document.getElementById("canvas1");//fishes,dust,UI,circle
ctx1 = can1.getContext("2d");//获得2D场景
can2 = document.getElementById("canvas2");//background,ane,fruits
ctx2 = can2.getContext("2d");
bgPic. src = "./src/background.jpg";
canWidth = can1.width;
canHeight = can1.height;
ane = new aneObj();
ane.init();
}
function gameloop()
{
window.requestAnimationFrame(gameloop);//比setInterval,setTimeout(time)更科学智能计算
var now = Date.now();
deltaTime = now - lastTime;
lastTime = now;
drawBackground();
ane.draw();
}
分别是html,ane,main的
谢谢你哦
举报