1

我是 iPhone 的 HTML 5 和 JS 的新手。canvas在我的应用程序中，我成功地通过以下代码获取了接触点（这是在我的game.js类中）：

canvas.addEventListener("click", mouseClickEvent, false);
function mouseClickEvent(e) {
  alert("Clicked x= "+e.layerX+" and clicked y= "+e.layerY);
}

我hole将类中的一个对象（）显示game.js为：

var hole = new Image();
hole.onload = function() {
  ctx.drawImage(hole,135,215,50,50);
}
hole.src = 'images/hole.png';

现在我需要的是：

1）将hole对象移动到触摸位置（如动画/移动）。

2）在孔中添加一个点击监听器（我试过canvas.addEventListener，但没有奏效）。

我已经搜索了很多。但无法找到合适的解决方案:(

一些教程说：删除并重绘对象以移动它。但我的屏幕上有几张图像，形状各异。

请帮我解决这个问题...

4

1 回答 1

1

您的触摸事件可以这样完成：

var hole = {x: 0, y: 0};

var touchEvents = function(e){
    e.preventDefault();
    if(e.targetTouches) e = e.targetTouches[0]; // since i like to test with a mouse, but still have it work with touch devices.
    hole.x=e.clientX;
    hole.y=e.clientY;
};

canvas.onmousemove=touchEvents;
canvas.ontouchmove=touchEvents;
canvas.ontouchstart=touchEvents;

这是从我的 js1k 条目中快速转换的，变量名很短，但也许你可以得到一些提示：http: //jsfiddle.net/9J25N/

于 2013-08-10T03:50:53.277 回答