Javascript 使thoughscreen的擦除工作（TouchEvent）

我做了一个简单的游戏，你必须删除一个彩色层，以显示图像。但它只能在我的桌面上工作，而不能在带有思维屏幕的东西（iphone或ipad）上工作。我知道我必须将MouseEvent替换为TouchEvent，但我不知道如何替换，因为我是一名编程新手。我希望有人能帮我

#画布{
背景图片：url（“img/image.jpg”）；
背景重复：无重复；
宽度：800px；
高度：800px；
}

艾伦·兰根达姆
（功能（）{
//创建新的画布元素并将其作为子元素追加
//，并返回对的引用
//新创建的canvas元素
函数createCanvas（父级、宽度、高度）{
var canvas={}；
canvas.node=document.createElement（'canvas'）；
canvas.context=canvas.node.getContext（'2d'）；
canvas.node.width=宽度| | 100；
canvas.node.height=高度| | 100；
parent.appendChild（canvas.node）；
返回画布；
}
函数init（容器、宽度、高度、填充颜色）{
var canvas=createCanvas（容器、宽度、高度）；
var ctx=canvas.context；
//定义自定义fillCircle方法
ctx.fillCircle=函数（x，y，半径，fillColor）{
this.fillStyle=fillColor；
this.beginPath（）；
这个。移动到（x，y）；
弧（x，y，半径，0，Math.PI*10，false）；
这个；
};
ctx.clearTo=函数（fillColor）{
ctx.fillStyle=fillColor；
ctx.fillRect（0，0，宽度，高度）；
};
ctx.clearTo（fillColor | |“#ddd”）；
//绑定鼠标事件
canvas.node.onmousemove=函数（e）{
如果（！canvas.isDrawing）{
返回；
}
var x=e.pageX-this.offsetLeft；
变量y=e.pageY-this.offsetTop；
var radius=40；//或其他
变量fillColor='#ff0000'；
ctx.globalCompositeOperation='destination out'；
ctx.fillCircle（x，y，半径，fillColor）；
};
canvas.node.onmousedown=函数（e）{
canvas.isDrawing=true；
};
canvas.node.onmouseup=函数（e）{
canvas.isDrawing=false；
};
}
var container=document.getElementById（'canvas'）；
初始（容器，800800，#99ff99'）；
})();

使用

ontouchmove

注册触摸动作，然后通过触摸点

事件进行交互。触摸

并使用每个项目的属性绘制圆圈，方法与在

onmousemove

中的操作相同

我还建议使用

let

或

const

变量类型，而不是

var

，因为

var

可能导致不幸的问题，请参见：

函数createCanvas（父级、宽度、高度）{
var canvas={}；
canvas.node=document.createElement（'canvas'）；
canvas.context=canvas.node.getContext（'2d'）；
canvas.node.width=宽度| | 100；
canvas.node.height=高度| | 100；
parent.appendChild（canvas.node）；
返回画布；
}
函数init（容器、宽度、高度、填充颜色）{
var canvas=createCanvas（容器、宽度、高度）；
var ctx=canvas.context；
//定义自定义fillCircle方法
ctx.fillCircle=函数（x，y，半径，fillColor）{
this.fillStyle=fillColor；
this.beginPath（）；
这个。移动到（x，y）；
弧（x，y，半径，0，Math.PI*10，false）；
这个；
};
ctx.clearTo=函数（fillColor）{
ctx.fillStyle=fillColor；
ctx.fillRect（0，0，宽度，高度）；
};
ctx.clearTo（fillColor | |“#ddd”）；
//绑定鼠标事件
canvas.node.onmousemove=函数（e）{
如果（！canvas.isDrawing）{
返回；
}
var x=e.pageX-this.offsetLeft；
变量y=e.pageY-this.offsetTop；
var radius=40；//或其他
变量fillColor='#ff0000'；
ctx.globalCompositeOperation='destination out'；
ctx.fillCircle（x，y，半径，fillColor）；
};
canvas.node.onmousedown=函数（e）{
canvas.isDrawing=true；
};
canvas.node.onmouseup=函数（e）{
canvas.isDrawing=false；
};
canvas.node.ontouchmove=函数（事件）{
for（让index=0；index
#画布{
背景图片：url（“img/image.jpg”）；
背景重复：无重复；
宽度：800px；
高度：800px；
}
使用
触摸启动
、
触地
和
触地移动
。您的代码不需要太多的调整。@ChloeAnderson谢谢您的回复！你能帮我用代码写吗？谢谢@ChloeAnderson！你能帮我做一下吗