防止在Android浏览器中滚动

Question

有没有办法阻止在Android浏览器中滚动呈现的HTML页面？以下内容似乎对Android浏览器中的页面滚动没有任何影响：

var preventDefault = function(e) {
    e.preventDefault();
    return false;
};
document.addEventListener('touchmove',preventDefault,false);
document.body.addEventListener('touchmove',preventDefault,true);
window.addEventListener('touchmove',preventDefault,true);

（我试过开和关。）

在我看来，Android Webkit使“窗口”与文档的长度相同，因此在浏览器本身上进行滚动，而不是在文档正文或DOM窗口对象上进行滚动。有点奇怪的是，这正是iOS上的webkit所做的，但上面的代码仍然有效。

Answer 1

回答我自己的问题。

问题最终是你需要捕获和抑制ontouchstart以及ontouchmove上的document以阻止浏览器滚动。这在iOS中肯定是不同的，但它在两个平台上的工作方式仍然相同。

我最终使用的实际代码看起来像这样：

var preventDefault = function(e){
    e.preventDefault();
};
var touchstart = function(e) {
    document.addEventListener('touchstart', preventDefault,false);
    document.addEventListener('touchmove',  preventDefault,false);
    /*do other stuff*/
};
var touchend = function(e) {
    document.removeEventListener('touchstart', preventDefault,false);
    document.removeEventListener('touchmove',  preventDefault,false);
};

element.addEventListener('touchstart',  touchstart, false);
element.addEventListener('touchend',    touchend,   false);

Answer 2

不适用于Android上的Chrome

但是防止窗口事件和停止立即传播有帮助！

处理程序应该不是被动的。

可能在capturing阶段添加事件处理程序也会有所帮助

但下面的这个片段是由我测试的

window.addEventListener("touchmove", function(event) {
    event.preventDefault();
    event.stopImmediatePropagation();
}, { passive: false });

但是ku zxsw指出