0

我有一个画布，我正在为我的游戏制作一个菜单屏幕：

var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");
canvas.width = 512;
canvas.height = 480;
document.body.appendChild(canvas);

ctx.font="30px monospace";
ctx.fillStyle = "black";
ctx.strokeText("click to begin",140,260);

当用户单击“单击开始”时，我希望它能够进入我的游戏，但考虑到我无法让 onclick 工作，我只想让它提醒它已经工作。到目前为止（基于我发现的教程和示例）我有以下代码：

mouse = (function (target) {
    var isButtonDown = false;

    c.addEventListener('mousedown', function () {
        isButtonDown = true;
    });

    return {
         isButtonDown: function () {
             return isButtonDown;
         }
    };
}(document));

var isButtonDown = input.isButtonDown();

if (isbuttondown == true) {
          alert("Mouse clicked");
}

当我运行这段代码时，它什么也不做。有人可以向我解释如何让这个工作，或者至少我需要改变什么？

提前致谢，

莱利

4

1 回答 1

1

这是一个解决方案。

解决方案

我已经删除了警报，而是使用了 console.log。检查控制台。

JS

canvas.addEventListener('click', function (evt) {
    var mousePos = getMousePos(canvas, evt);
    var message = 'Mouse Clicked at ' + mousePos.x + ',' + mousePos.y;
    console.log(message);
}, false);

function getMousePos(canvas, evt) {
    var rect = canvas.getBoundingClientRect();
    return {
        x: evt.clientX - rect.left,
        y: evt.clientY - rect.top
    };
}

编辑：这是与警报选项相同的小提琴。小提琴

于 2013-11-01T07:25:02.830 回答