0

私はhtml5が初めてです。キャンバスに長方形を追加する小さなコードを書きました。キャンバスをダブルクリックすると、どのように機能しないのか、どこが間違っているのか教えてもらえますか?

<script>
function init() {
    var canvas2 = document.getElementById("canvas2");
    canvas2.ondblclick = doubleclickhandler;

}
function doubleclickhandler (){
      var canv = document.getElementById("canvas2");
      var ctx = canv.getContext("2d"); 
      ctx.fillStyle = "rbga(0,200,0,1)" ;
      ctx.fillRect = (36,10,22,22);
}
</script>
<style>
#div2
{
    float:left;
    width:100px;
    height:150px;
    margin:10px;
    border:1px solid #aaaaaa;

}
</style>
<body onLoad="init()">
 <div id= "div2">
 <canvas id="canvas2" width="100" height="150" ></canvas>          
 </div>
</body>
4

2 に答える 2

3

ctx.fillRect = (36,10,22,22)は代入ですctx.fillRectが、通常は属性ではなくメソッドです。関数のように呼び出す必要があります。

ctx.fillRect(36, 10, 22, 22);
于 2012-04-07T12:57:51.977 に答える
3

fillRectは関数であり、プロパティではありません。あなたはそれを呼び出す必要があります。私の知る限り、それはあなたの唯一の間違いです。

<script>
function init() {
    var canvas2 = document.getElementById("canvas2");
    canvas2.ondblclick = doubleclickhandler;

}
function doubleclickhandler (){
      var canv = document.getElementById("canvas2");
      var ctx = canv.getContext("2d"); 
      ctx.fillStyle = "rbga(0,200,0,1)" ;
      ctx.fillRect(36,10,22,22);
}
</script>
<style>
#div2
{
    float:left;
    width:100px;
    height:150px;
    margin:10px;
    border:1px solid #aaaaaa;

}
</style>
<body onLoad="init()">
 <div id= "div2">
 <canvas id="canvas2" width="100" height="150" ></canvas>          
 </div>
</body>
于 2012-04-07T12:59:28.233 に答える