0

Mozilla HTML5 Canvas チュートリアルhereに従おうとしています。しかし、私はエラーが発生します:

Uncaught ReferenceError: draw is not defined

私は自分のスクリプトを次のように持っています：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

 <script type="application/javascript">
$(function() {

function draw() {
      var canvas = document.getElementById("main");
      if (canvas.getContext) {
        var ctx = canvas.getContext("2d");

        ctx.fillStyle = "rgb(200,0,0)";
        ctx.fillRect (10, 10, 55, 50);

        ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
        ctx.fillRect (30, 30, 55, 50);
      }
    }


});

</script>


</head>
 <body onload="draw();">
   <canvas id="main" width="150" height="150"></canvas>


</body>

canvas 要素の前後にスクリプトを配置して実験しましたが、変化はありません。

誰が私が間違っているのか知っていますか?

4

2 に答える 2