Вопросы Теги

MouseListener и объект холста HTML5

Я просматривал учебные пособия, но все же не могу понять, где я ошибаюсь. Кажется, это должно быть очень просто, но это вызывает у меня проблемы. Ниже приведен простой код для создания слушателя мыши для объекта холста. В настоящее время функция clickReporter не вызывается при нажатии на холст. Есть идеи, почему бы и нет?

HTML5 

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Play Area 2 - Mouse Events and the Canvas</title>
    <script src="play_area_2.js" type="text/javascript"></script>
    </head>

    <body onload="init();">
    <canvas id="myCanvas" width="500" height="400">
    Your browser dosen't support the HTML5 canvas.</canvas><br />
    </body>
    </html>

JavaScript 

    var canvas;
    var context;

    function init() {
        canvas = document.getElementById("myCanvas");
        context = canvas.getContext("2d");

        drawBox();

        canvas.addEventListener('onclick', clickReporter, false);
    }

    function clickReporter(e) {
        alert("clicked");
    }

    function drawBox() {
        context.fillStyle = "black";
        context.strokeRect(20, 20, canvas.width-20, canvas.height-20);
    }
7
задан Brian Tompsett - 汤莱恩 21 October 2019 в 21:09
поделиться