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是函数而不是属性。你必须打电话给它。AFAIK 那是你唯一的错误。

<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 回答