我试图让touchmove
事件注册到一个使用 Google 应用脚本 html 服务编写的简单网络应用程序,以便我可以制作在 iPad 和桌面上运行的简单网络应用程序。
我所做的只是首先加载一个网页,它按预期工作:
function doGet() {
return HtmlService.createHtmlOutputFromFile('test page');
}
然后我在 html 页面上创建了一个简单的画布:
<html>
<canvas id="canvas" width="200" height="200" style="border:1px solid #000000;">
</canvas>
<script>
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
ctx.font = "bold 12px sans-serif";
ctx.fillStyle="black";
ctx.fillText("TEST",50,50);
canvas.addEventListener("touchmove",testme,false);
function testme(e) {
e.preventDefault();
alert("testme");
}
</script>
</html>
这只是我尝试过的最新变体。在此示例中,绑定click
或全部在桌面上正常工作。但是,在 iPad 上尝试 或不做任何事情。我已经在 iPad 上使用 Chrome 和 Safari 进行了测试。mousedown
mousemove
touchstart
touchmove
我也尝试过添加类似的东西:
document.addEventListener("touchmove",doPreventDefault,false);
并有一个调用 的简单函数preventDefault()
,但这也无济于事。
我做错了什么,还是因为它是谷歌应用程序脚本 html 服务而必须做一些不同的事情?
我现在已经尝试过使用 jQuery(刚刚阅读了如何做),但它似乎仍然无法在 iPad 上正常工作:
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<p>Test</p>
<br><br>
</body>
<canvas id="canvas" width="200" height="200" style="border:1px solid #000000;">
</canvas>
<script>
$(document).ready(function() {
$("#canvas").bind('touchstart',function(e) {
alert("Hello world!");
});
$("p").mousedown(stuff);
$('#canvas').touchmove(onMove);
});
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
ctx.font = "bold 12px sans-serif";
ctx.fillStyle="black";
ctx.fillText("TEST",50,50);
function onMove(e) {
alert("testing");
}
function stuff(e) {
alert("Stuff");
}
</script>
</html>
该mousedown
事件运行良好,并且它可以通过触摸来工作 - 事实上,它似乎mousedown
与mouseup
iPad 上的触摸相关联。但是mousemove
不起作用,touchmove
or touchstart
or也不起作用touchend
。如上所示,我已经尝试过使用 bind 和更直接的方法。
我做错了什么来完成这项工作吗?