Javascript 如何在 iPad webapp 上禁用滚动?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7733703/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 03:22:34  来源:igfitidea点击:

How do I disable scrolling on an iPad webapp?

javascriptipadweb-applicationsscroll

提问by Valli

The usual:

通常:

document.body.addEventListener('touchmove',function(event){event.preventDefault();},false); 

isn't working for me. I am trying to make my iPad webapp feel as native as possible. Any answer is appreciated.

不适合我。我试图让我的 iPad webapp 感觉尽可能原生。任何答案表示赞赏。

回答by Alnitak

Put that handler on the documentelement directly, not on the body.

将该处理程序document直接放在元素上,而不是放在body.

I've had success with the following:

我在以下方面取得了成功:

<meta name="viewport" content="user-scalable=1.0,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">

Then with jQuery:

然后使用 jQuery:

$(document).bind('touchmove', false);

This will also be useful if you want to handle different orientations:

如果您想处理不同的方向,这也很有用:

<link rel="stylesheet" type="text/css" href="css/main.css" media="all">
<link rel="stylesheet" type="text/css" href="css/landscape.css" media="all and (orientation:landscape)">
<link rel="stylesheet" type="text/css" href="css/portrait.css" media="all and (orientation:portrait)">