0

touchmoveiPad でもデスクトップでも機能するシンプルな Web アプリを作成できるように、Google アプリ スクリプト HTML サービスを使用して記述されたシンプルな Web アプリにイベントを登録しようとしています。

最初に Web ページをロードするだけで、期待どおりに動作します。

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()、それも役に立ちませんでした。

私は何か間違ったことをしていますか、それともGoogle Appsスクリプト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イベントは正常に機能し、イベントはタッチで機能します。実際、iPad ではタッチと機能しているように見えますmousedown。mouseupしかし、機能せず、またはもmousemove機能しません。上記のように、バインドなどをより直接的に試しました。touchmovetouchstarttouchend

この作業を行うために私が間違っていることはありますか?

4

2 に答える 2

1

Caja イシュー トラッカーに機能リクエストを追加して、それらのイベントをホワイトリストに登録できます。現在、ホワイトリストに登録されていません。

于 2013-04-19T18:20:39.593 に答える
0

htmlservice ドキュメントを読んでください。jquery のような caja 互換の方法を使用しない限り、dom を操作することはできません。

于 2013-04-19T13:46:30.223 に答える