0

我试图让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 进行了测试。mousedownmousemovetouchstarttouchmove

我也尝试过添加类似的东西:

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事件运行良好,并且它可以通过触摸来工作 - 事实上,它似乎mousedownmouseupiPad 上的触摸相关联。但是mousemove不起作用,touchmoveor touchstartor也不起作用touchend。如上所示,我已经尝试过使用 bind 和更直接的方法。

我做错了什么来完成这项工作吗?

4

2 回答 2

1

您可以在 Caja 问题跟踪器上添加功能请求以将这些事件列入白名单。他们目前不在白名单上。

于 2013-04-19T18:20:39.593 回答
0

阅读 htmlservice 文档。除非您使用像 jquery 这样与 caja 兼容的方式,否则您无法操作 dom。

于 2013-04-19T13:46:30.223 回答