0

我的手机应用程序中有一个登录表单，我需要首先将表单元素放在屏幕中央，然后当有人尝试输入登录名或密码时，输入块会向上移动，这样它就不会被键盘隐藏。虽然我的代码在浏览器中运行良好，但在 phonegap 中我忽略了这个事件。请指导

<html>
<head>
    <title>daDrive - Login</title>
    <script type="text/javascript" charset="utf-8" src="../cordova-2.5.0.js"></script>
    <script src="../js/jquery.js"></script>
    <script src="../js/jquery-1.9.1.js"></script>
    <script src="../js/jquery-ui-1.10.3.js"></script>
    <script src="../js/jquery.mobile-1.3.1.min.js"></script>
    <script src="../js/code/util.js"></script>
    <script src="../js/code/login.js"></script>
    <script src="../js/code/register.js"></script>
    <script src="../js/code/account.js"></script>
    <script src="../js/code/home.js"></script>
    <script src="../js/code/constants.js"></script>
    <link rel="stylesheet"  href="../css/common.css" />
    <link rel="stylesheet"  href="../css/jquery.mobile.theme-1.2.0.min.css" />  
    <link rel="stylesheet" href="../css/jqm-docs.css"/>
    <script type="text/javascript">
        $(document).ready(function(){
            $("input").focus(function(){
                if(flag==0){
                    flag=1;
                    $("#loginPass_txtboxes").animate({"margin-top": "-=30%"}, "slow");
                }
            });
            document.addEventListener('click', function(e) {
                e = e || window.event;
                var target = e.target || e.srcElement;
                if(target.nodeName.toLowerCase()!="input" && flag==1){
                    flag=0;
                    $("#loginPass_txtboxes").animate({"margin-top": "+=30%"}, "slow");
                }
            });
        });
    </script>
</head>
<body>
    <div data-role="page" id="page_id">
        <div id="loginPageLogo" style="margin-top:3%;">
            <center><img src="../images/logo_dadrive.png"/></center>
        </div>            
        <div data-role="content" id="main_page" style="padding:0 !important;">      
            <div id="login_middle_content">
                <div id="loginPass_txtboxes" style="width: 60%; margin-left: 20%; margin-top:35%" onblur="shiftDown()">
                    <div data-role="fieldcontain" class="ui-hide-label" >
                        <label for="LoginId">Login ID:</label>
                        <input type="text" name="LoginId" id="LoginId"  value="" placeholder="Login Id" data-mini="true"/>
                    </div>
                    <div data-role="fieldcontain" class="ui-hide-label">
                        <label for="password">Password:</label>
                        <input type="password" name="password" id="password" value="" placeholder="Password" data-mini="true"/>
                    </div>
                </div>
                <div align="center">
                    <a href="javascript:login();" data-role="button"  data-theme="b" id ="button_size">Login</a>
                </div>
            </div><!--middle-->     
        </div>
    </div><!--page -->
</body>

4

1 回答 1

0

请参阅此问题的答案，其中还提供了一些您可能喜欢的方便事件的详细信息。

于 2013-06-03T18:12:00.360 回答