Question

我想在它上面绘制这个图像的副本但是向下，但是.onclick对我的图像对象不起作用。我已经测试了它，并且使用canvas.onclick完全正常，但不是我的图像'粘性'。

代码如下：

var canvas = document.getElementById('myCanvas');
var context = canvas.getContext("2d");

var sticky = new Image();
sticky.src = "sticky.png";
sticky.onload = function() {

    context.drawImage(sticky, 0, 0);
};

sticky.onclick = function() {

    context.drawImage(sticky, 0, 100);
};

</script>

Answer 1

您的活动需要在画布上，而不是图像。因为创建时，图像对象不会自动添加到dom。

当画布draw成像时，它复制了它，它会将像素复制到自身。

然后将您的图像添加到dom中，并听取画布上的点击。

＆＃13;

var canvas = document.getElementById('myCanvas');
var context = canvas.getContext("2d");
var sticky = new Image();
var sticky2 = new Image();

sticky.src = "http://lorempixel.com/250/60/";
sticky2.src = "http://lorempixel.com/150/60/";

sticky.onload = function() {
  context.drawImage(sticky, 0, 0);
};

canvas.onclick = function() {
  context.drawImage(sticky2, 0, 100);
};

＆＃13;

<canvas id="myCanvas"></canvas>

＆＃13;

无法添加.onclick到图像javascript

1 个答案: