Phonegap 3.7 / jQuery Mobile iOS 7当键盘打开时,单击提交按钮创建较小的屏幕并且不提交表单

时间:2016-01-13 19:39:51

标签: ios cordova jquery-mobile

  • 只有在单击表单提交按钮时才会出现问题。
  • 使用完成按钮关闭键盘允许提交按钮提交。
  • 点击键盘上的GO按钮也会提交表格。
  • 此外,我所拥有的忘记密码链接是一个通用的href,在相同条件下也存在同样的问题。
  • 在iOS 9中,问题不存在
  • 在Android上,问题不存在

我的假设是它与特定代码无关,因为即使是href也具有相同的效果。我已尝试对代码进行无数次更改以使其正常工作,但似乎没有任何解决方法。

以下是代码:

            <form id="login-form" class="custom-form" method="POST">
            <div data-role="fieldcontain">
                <label for="email">Email:</label>
                <input class="required email" type="email" name="email" id="email">

                <label for="password">Password:</label>
                <input minlength="6" class="required" type="password" id="password" name="password">

            </div>
            <div class="form-action-bar">
                <div style="text-align:left;" onclick="window.location = 'recoverPassword.html';">
                    <a id="recoverPassword">
                        <span id='lblChangePassword'>Forgot Password?</span>
                    </a>
                </div>
                <input type="submit" data-inline="true" data-theme="b" data-role="button" value="Login">
             </div>
        </form>

            $(document).on("pagecreate", '#login-page', function(event) {
            //event.preventDefault();
            $("#login-form").validate({
                onfocusout: false,
                onkeyup: false,
                onclick: false,
                errorPlacement: function(error, element) {
                    element.parent().after(error);
                },
                messages: {
                    email: {
                        required: "This field is required.",
                        email: "This email address is not valid."
                    },
                },
                submitHandler: function() {
                    server.login($('#email').val(), $('#password').val(), function(response) {
                        if (response.invalid == 1) {
                            $("#errormsg").html(translate(language, 'Invalid User Login'));
                            $("#errormsg").show();
                            localStorage.removeItem('userinfo');
                            localStorage.removeItem('uniqueID');                                
                        } else {
                            localStorage.setItem("uniqueID", response.data.useruniqueID);
                            localStorage.setItem('userinfo', JSON.stringify(response.data));

                            if (response.data.officeid) {
                                localStorage.setItem("agencyid", response.data.officeid);
                                server.getAgency(response.data.officeid, localStorage.getItem("uniqueID"), function(data) {
                                    if (data.invalid == 1) {
                                        $("#errormsg").html(translate(language, 'Invalid Agency Id'));
                                        $("#errormsg").show();
                                        localStorage.removeItem('officeinfo');
                                        localStorage.removeItem('staffinfo');
                                        localStorage.removeItem('agencyid');
                                        window.location = 'selectagency.html';
                                    } else {
                                        var dataToStore = JSON.stringify(data);
                                        localStorage.setItem('officeinfo', dataToStore);
                                        console.log('office info: ' + dataToStore);
                                        window.location = 'index.html';
                                    }
                                });
                            } else {
                                window.location = 'selectagency.html';
                            }
                        }
                    });
                }
            });
        });

1 个答案:

答案 0 :(得分:0)

事实证明,它不是特定于Phonegap,而是jQuery Mobile,iOS浏览器(Safari和Chrome)以及特定css样式的问题。

问题在于有一个立场:固定; html元素上的属性,与jQuery Mobile发生冲突,导致特定输入类型=“提交”或输入类型=“按钮”,当iOS键盘在屏幕上时无响应。