Touchmove不能与Google apps scripts html服务一起工作

Touchmove doesn't work with Google apps scripts html service

本文关键字：html 服务 一起 工作 scripts apps 不能 Google Touchmove      更新时间：2023-09-26

我试图让touchmove事件注册使用谷歌应用程序脚本html服务编写的一个简单的web应用程序，这样我就可以使简单的web应用程序在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或mousedown或mousemove在本例中在桌面上都可以正常工作。然而，尝试touchstart或touchmove在iPad上不做任何事情。我在iPad上用Chrome和Safari进行了测试。

我也试过添加一些东西，比如:

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或touchstart或touchend也不起作用。我已经尝试了bind和更直接的方法，如上面所示。

有什么我做错了让这个工作吗?

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

阅读htmlservice文档。你不能操作dom，除非你使用caja兼容的方式，如jquery。

相关文章：