1

Web ページをブラウザーで表示すると、次の関数でこのコンソール エラーが発生します。

function drawStartButton(){
            image.onload = function(){
                context.drawImage(image, 260.5, 60);
                image.on("mousdown", function(){
                    drawLevelOneElements();
                }
            });
            image.src = "StartButton.png";
            /** Now I need to add an event listener to the area of the canvas on 
                on which the button image is displayed, in order to 'listen' for 
                a click on the button */
            var boundingBox = myGameCanvas.getBoundingClientRect();
            //var mouseX = (mouse_event.clientX-boundingBox.left) * (myGameCanvas.width/boundingBox.width);
            //var mouseY = (mouse_event.clientY-boundingBox.top) * (myGameCanvas.height/boundingBox.height);
            boundingBox.onmousemove = function(e){
                var mouseX = e.pageX - this.offsetLeft;
                var mouseY = e.pageY - this.offsetTop;
                var pixels = context.getImageData(mouseX, mouseY, 1, 1);
            }

            /** There maybe more than one pixel at this location so use a loop
                to test whether any of the pixels have an alpha value greater than
                0. With pixel data, 3 is alpha, so check data[3] and every fourth
                element in data after that. */
            //for (var i=3; i<pixels.data.length; i+=4;){
                /** If a non- zero alpha is found, stop and return "true"- the click
                    was on a part of the canvas that has colour on it. */
            //  if(pixels.data[i]!=0) return true;
            //}

            /** If the function gets here, then the mouse click wasn't on a painted
                part of the canvas. */
            //return false;
            /**myGameCanvas.getElementById("StartButton").onClick = function(e){
                drawLevelOneElements();
            } */    

        }

エラーは、2 行目から始まる関数の最後で発生します。最初は単純にその行を持っていました};が、このエラーが発生した後、次のように変更しました});

ただし、ページをリロードすると、キャンバスはまだ空白であり、コンソールが示した場所に挿入したにもかかわらず、コンソールは同じエラーについて不平を言って)います。

このエラーについて提案されたトピックのいくつかを調べましたが、関数がキャンバス上に意図したものを表示するために何をする必要があるかを示しているものはありませんでした。誰にも提案はありますか？

4

3 に答える 3

1 
image.onload = function(){
                context.drawImage(image, 260.5, 60);
                image.on("mousdown", function(){
                    drawLevelOneElements();
                }
            });

する必要があります

image.onload = function(){
                context.drawImage(image, 260.5, 60);
                image.on("mousdown", function(){
                    drawLevelOneElements();
                })
            };
于 2012-04-23T15:44:26.863 に答える
1 
image.onload = function(){
    context.drawImage(image, 260.5, 60);
    image.on("mousdown", function(){
        drawLevelOneElements();
    }
});

する必要があります:

image.onload = function(){
    context.drawImage(image, 260.5, 60);
    image.on("mousdown", function(){
        drawLevelOneElements();
    });
};

最後に注意してください)

于 2012-04-23T15:46:25.910 に答える
0

これを変える：

image.on("mousdown", function(){
                    drawLevelOneElements();
                }

に

image.on("mousdown", function(){
                    drawLevelOneElements();
                });
于 2012-04-23T15:44:18.300 に答える