2

我正在使用 PhoneGap 以及 JQuery Mobile 和 HTML 元素来实现我的项目。

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
    <meta charset="utf-8">
    <meta name="viewport" content="target-densityDpi=device-dpi, width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" /> 
    <title>Meri Mrji</title> 
    <link rel="stylesheet" href="style/main.css">
    <link rel="stylesheet" href="style/jmobile.min.css" />
    <script src="jquery.js"></script>
    <script src="jquery.mobile.js"></script>
    <script type="text/javascript">
    </script>
</head>
<body>
    <div data-role="page" id="signup" >
         <div class="contentwrap">
            <section>
            <div class="sectionhead">
                    <h1><strong>Sign Up</strong></h1>
                </div>
                <form class="forms" action="http://google.com" type="POST">
                    <h1>Please enter <strong>Your Details</strong></h1>
                    <input type="text" placeholder="Full Name" />
                    <input type="email" placeholder="Email Address" />
                    <input type="tel" placeholder="Mobile Number" />
                    <input type="text" placeholder="Username" />
                    <input type="password" placeholder="Password" />
                    <p class="terms">
                    <a href="#signin" >View Terms</a>
                    <input type="button" value="Click me" class="green_btn" />
                    </p>
                </form>
            </section>
        </div>
    </div>
</body>
</html>

单击并从一个页面过渡到另一个页面，其他所有事情似乎都可以正常工作。但是，每当我单击任何文本字段以填写表单时，CSS 似乎都会被扭曲和放大。任何其他人都面临着与 Phone Gap 相同的问题或知道其他出路。

- - - - - - 编辑 - - - - - -

启动时 App 启动时视口的分辨率是一些

 width : 500 ;
 height : 794;

单击输入字段后

 width : 320 ;
 height : 268;

有没有办法我可以使用一些

 preventdefault() method

或者如果我可以再次强制将视口更改回宽度：500 和高度：794？

4

2 回答 2

0

删除target-densityDpi=device-dpi会停止缩放我的 HTC Evo。更多关于视口的见解在这里。

于 2012-04-27T21:25:37.703 回答
0

终于在一些随机网址上得到了解决方案：http: //uihacker.blogspot.in/2011/01/android-phonegap-scale-webview-to-fit.html

这是本机代码，它似乎覆盖了WEBVIEW中的所有内容，并为其提供一致的视图，在单击任何输入值时没有缩放效果:)

于 2012-05-02T17:25:42.837 回答