Question

我无法弄清楚我的代码有什么问题。请帮我。当我尝试运行代码时，它会给出上面的错误。

<!DOCTYPE html>
<html>

 <head>
  <meta charset="utf-8"/>
  <title>Mark Snier</title>
  <link rel="stylesheet" type="text/css" href="stylesheet.css">

   <script type="text/javascript">
 function init() {

  var canvas = document.getElementById('canvas');
  var ctx = canvas.getContext('2d');
  var raf;
  var animatie = window.requestAnimationFrame;
  var ball = {
  x: 100,
  y: 100,
  vx: 5,
  vy: 2,
  radius: 25,
  color: 'red',
  draw: function() {
    ctx.beginPath();
    ctx.arc(this.x, this.y, this.radius, 0, Math.PI*2, true);
    ctx.closePath();
    ctx.fillStyle = this.color;
    ctx.fill();

    for (var h = 0; h < 100; h++) {
      ctx.fillRect (canvas.width-10, w, 10, 10);
      w += 11
    }
    for (var i = 0; i < 100; i++) {
      ctx.fillRect (0, x, 10, 10);
      x += 11
    }
    for (var k = 0; k < 100; k++) {
      ctx.fillRect (y, canvas.height-10, 10, 10);
      y += 11
    }
    for (var j = 0; j < 100; j++) {
      ctx.fillRect (z, 0, 10, 10);
      z += 11
    };
  };
 }
 ball.draw();       

 function draw() {
   if (ball.y+ball.vy > canvas.height || ball.y+ball.vy < 0) {
      ball.vy = -ball.vy;
   }
   if (ball.x+ball.vx > canvas.width || ball.x+ball.vx < 0) {
      ball.vx = -ball.vx;
   }
   ctx.clearRect(0,0, canvas.width, canvas.height);
      var x = 0
      for (var i = 0; i < 100; i++) {
        ctx.fillRect (0, x, 10, 10);
        x += 11
      }
      ball.draw();
      ball.x += ball.vx;
      ball.y += ball.vy;
      raf = window.requestAnimationFrame(draw);
   }
   ball.draw();
   refresh();
   function refresh() {
      draw()
      refresh()
   }    
 }
 </script>

 </head>

   <body onload="init()">
    <canvas id="canvas" width="802" height="395"></canvas>

   </body>

 </html>

Answer 1

错误告诉您忘了关闭任何循环或函数。在您的情况下，您的对象中有;

function init() { 
   var ball = {
      ...
      draw: function() {    
         ...
      }// <-- Remove ; here
   };
}

希望它有所帮助。

Answer 2

我不知道哪个工具给了你这个奇怪的错误信息，但当你在Chrome中打开页面时，它清楚地告诉你

Uncaught SyntaxError: Unexpected token ; in line 46

如果您在适当的编辑器中打开代码，例如Webstorm，它表示同样的错误。

在那里定义了一个包含函数ball的对象draw，并且因为它是在对象内定义的，所以它不能以;终止。如果删除分号，页面上会出现一个红色的球。有更多的错误，但这应该让你开始。这是正确的代码：

var ball = {
  // ...
  draw: function() {
    // ...
   for (var j = 0; j < 100; j++) {
     ctx.fillRect (z, 0, 10, 10);
     z += 11
   } // <-- you should remove the semicolon you have here - it is unneccessary but is ignored and does not cause problems
 }   // <-- you must remove the semicolon you have here 
}

Javascript错误：“缺少”参数列表后“

2 个答案: