如果单击画布中的图像，则发出警报

Alert if clicked image in canvas

本文关键字：图像 单击 布中 如果      更新时间：2023-09-26

所以我在画布中有动画图像。它从左到右。我想要：

alert("Wokrs!");

如果我点击图片。有人知道怎么做吗？这是我的代码：

    <head>
        <script src="events.js">
        </script>
        <script src="animation.js">
        </script>
<script>
window.onload = function(){
    var events = new Events("myCanvas");
    var canvas = document.getElementById("myCanvas");
    var c = canvas.getContext("2d");
    var anim = new Animation("myCanvas");

    var image = new Image();
    anim.setDrawStage(function()
    {
        c.clearRect(0, 0, 3000, 3000);
        c.drawImage(image, anim.getFrame() - 100, Math.cos(anim.getFrame() / 25) * 60);

        if(events.getMousePos() != null) 
        {
        //Here I want to do alert("Works!"); if mouse clicked image.
        }
    });
    image.onload = function()
    {
        anim.start();
    };
    image.src = "mojaRyba.png";
    events.listen();
};
</script>
    </head>
    <body>
        <canvas id="myCanvas" width="600" height="250" style="border:1px solid black;">
        </canvas>

@编辑

我添加了更多的代码。

您需要添加一个点击事件处理程序，下面是一个示例：

canvas.addEventListener("click", function(
    alert("Works!");
)
相关文章：