JavaScriptでキオスクモードを実現するには？

タッチスクリーンパネル付きのデバイス（タブレット等）で、タッチ操作を禁止したい場合、
例えば次のようなコードを初期化時に書けば良さそうですが、一部の要素に限って許可したい場合は、どのように書くと良いでしょうか？
window.addEventListener('touchmove', function(ev) {
　ev.preventDefault();
}...

※他の方法でも構いません。
※いわゆる「キオスクモード」化を少し調べた処、色々と彼方此方に対策しないといけないようで、上手い手が無いか質問させてもらいました。
※当面、Android端末が対象です。

No.1 ベストアンサー 回答者： Ogre7077 回答日時： 2022/08/21 11:10

// タッチして動かすことを禁止する

var cancel = function(ev) {
_ // 「一部の要素に限って許可」するか判定する
_ var el = ev.target;
_ var ok = el.closest('.touchOK') != null;
_
_ // 許可できなければキャンセル
_ if (!ok) ev.preventDefault();
}
var options = { passive: false };
window.addEventListener('touchmove', cancel, options);

余談ではありますが、

最近は性能改善のために touchmove 等はキャンセルできない規定値のようなので、イベント登録の際は passive:false の指定をお忘れなく。
参考)
https://developer.mozilla.org/ja/docs/Web/API/Ev …

この回答へのお礼

成る程、良く判りました。
また、余談の件も有難う御座います。

お礼日時：2022/08/21 16:37