ios 如何防止在手机间隙中运行的应用垂直滚动?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6193016/
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-30 20:10:36  来源:igfitidea点击:

How to prevent app running in phone-gap from scrolling vertically?

iphoneioscordova

提问by Casey Flynn

I'm trying out phone gap and I want my application to not scroll up and down when the user drags their finger across the screen. This is my code. Can anyone tell me why it's still allowing scrolling?

我正在尝试电话间隙,我希望我的应用程序在用户在屏幕上拖动手指时不会上下滚动。这是我的代码。谁能告诉我为什么它仍然允许滚动?

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta name = "viewport" content = "user-scalable=no,width=device-width" />
    <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />-->

    <meta http-equiv="Content-type" content="text/html; charset=utf-8">

    <!-- iPad/iPhone specific css below, add after your main css >
    <link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />        
    <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />       
    -->
    <!-- If you application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here -->
    <script type="text/javascript" charset="utf-8" src="phonegap.0.9.5.1.min.js"></script>
    <script type="text/javascript" charset="utf-8">


    // If you want to prevent dragging, uncomment this section
    /*
    function preventBehavior(e) 
    { 
      e.preventDefault(); 
    };
    document.addEventListener("touchmove", preventBehavior, false);
    */

    /* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
    see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
    for more details -jm */
    /*
    function handleOpenURL(url)
    {
        // TODO: do something with the url passed in.
    }
    */

    function onBodyLoad()
    {       
        document.addEventListener("deviceready",onDeviceReady,false);
    }

    /* When this function is called, PhoneGap has been initialized and is ready to roll */
    /* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
    see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
    for more details -jm */
    function onDeviceReady()
    {
        // do your thing!
        navigator.notification.alert("PhoneGap is working")
    }
    touchMove = function(event) {
        // Prevent scrolling on this element
        event.preventDefault();
    }

</script>
<style>
#container {
width:100%;
height:100%;
}
</style>

</head>

    <body onload="onBodyLoad()">
        <div id="container" ontouchmove="touchMove(event);">
        </div>
    </body>
</html>

回答by gregmatys

if you're using Cordova 2.3.0+ find config.xml and add this line:

如果您使用的是Cordova 2.3.0+ 查找 config.xml 并添加以下行:

<preference name="UIWebViewBounce" value="false" />

<preference name="UIWebViewBounce" value="false" />

or in Cordova 2.6.0+:

或在Cordova 2.6.0+ 中:

<preference name="DisallowOverscroll" value="true" />

<preference name="DisallowOverscroll" value="true" />

回答by Felipe Brahm

Run this code when the page is loaded to disable dragging:

加载页面时运行此代码以禁用拖动:

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

Here's an example with jQuery:

下面是一个 jQuery 的例子:

$(document).ready(function() {
    document.addEventListener('touchmove', function(e) { e.preventDefault(); }, false);
});

回答by Reyraa

in your config file use

在您的配置文件中使用

<preference name="webviewbounce" value="false" />
<preference name="DisallowOverscroll" value="true" />

回答by Spawnrider

if you're using Cordova 2.6.0+find config.xml, just add/modify this line:

如果您使用Cordova 2.6.0+find config.xml,只需添加/修改这一行:

<preference name="DisallowOverscroll" value="true" />

<preference name="DisallowOverscroll" value="true" />

回答by Ravindranath Akila

Add the following entry to config.xml file:

将以下条目添加到 config.xml 文件:

<preference name="DisallowOverscroll" value="true" />

回答by zingle-dingle

You didn't say if this is a native app or a web app.

您没有说明这是本机应用程序还是 Web 应用程序。

If this is a native app you can turn off scrolling on the webview

如果这是本机应用程序,您可以关闭 webview 上的滚动

UIScrollView* scroll;  //
for(UIView* theWebSubView in self.webView.subviews){  // where self.webView is the webview you want to stop scrolling.
    if([theWebSubView isKindOfClass:[UIScrollView class] ]){
        scroll = (UIScrollView*) theWebSubView;
        scroll.scrollEnabled = false;
        scroll.bounces = false;
    }
}

otherwise here is a link on the phonegap wiki for preventing scrolling. http://wiki.phonegap.com/w/page/16494815/Preventing-Scrolling-on-iPhone-Phonegap-Applications

否则这里是 phonegap wiki 上用于防止滚动的链接。 http://wiki.phonegap.com/w/page/16494815/Preventing-Scrolling-on-iPhone-Phonegap-Applications

回答by user3085992

In config.xml of your project, under preferences for iOS set DisallowOverscroll to true. By default it is false which makes whole view to scroll along with inner elements of the view.

在项目的 config.xml 中,在 iOS 的首选项下将 DisallowOverscroll 设置为 true。默认情况下它是假的,这使得整个视图与视图的内部元素一起滚动。

<preference name="DisallowOverscroll" value="true" />

回答by volf

For me it work's perfect, when i use the body-selector with jquery. Otherwise i was not able to open external links with Phonegap.

对我来说,当我使用带有 jquery 的 body-selector 时,它是完美的。否则我无法使用 Phonegap 打开外部链接。

$('body').on('touchmove', function(evt) {
    evt.preventDefault(); 
})

回答by k2fx

Changed UIWebViewBounce to DisallowOverscroll in 2.6.0

在 2.6.0 中将 UIWebViewBounce 更改为 DisallowOverscroll

回答by seb

now you just have to put <preference name="DisallowOverscroll" value="false" />to <preference name="DisallowOverscroll" value="true" />in your config.xml file.

现在你只需把<preference name="DisallowOverscroll" value="false" /><preference name="DisallowOverscroll" value="true" />在你的config.xml文件。