Touch 上的全屏事件在 Chrome 上不起作用

Question

在我的移动应用中，我想在用户向上滑动时切换全屏。
所以当touchend 事件被触发时，我打电话给document.documentElement.webkitRequestFullScreen();
问题是它不适用于移动 Chrome 56+ 中的我。

这里是例子。 https://jsfiddle.net/ibmw/tnncaxj0/6/

有趣的是：这个问题只有在 touchstart 和 touchend 之间进行 touchmove 时才会出现。

在控制台中出现错误：

在“元素”上执行“请求全屏”失败：API 只能是 由用户手势启动。 document.documentElement.webkitRequestFullScreen();

有人知道怎么解决吗？

Answer 1

您必须在 touchmove 上调用preventDefault()，并将new option 传递给addEventListener()。这对我有用：

addEventListener('touchmove', onTouchMove, {passive: false});

function onTouchMove(e) {
  e.preventDefault
}