jQuery Mobile无法使用PhoneGap

时间:2013-03-19 20:46:27

标签: android html5 jquery-mobile cordova

我正在使用PhoneGap应用,正在使用jQuery Mobile。我上次参与该项目时看起来很棒,但现在jQuery Mobile停止了工作。发生了什么事?

这是我的代码:

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
        <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
    </head>

    <body>
        <div id="page" data-role="page" data-theme="b">
            <div data-role="content">
            <h2>Login To Carpool Mobile</h2>
            <p align="right"><a href="registration.html" id="showregistration">Don't have an account? &rarr;</a></p>
                <form method="post" id="loginForm">

                    <label for="password">Email:</label>
                    <input class="required" type="text" name="username" id="username" placeholder="username@target.com">

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

                    <input type="button" value="Login" id="submitButton" onClick="handleLogin()">
                </form>
            </div>
        </div>

        <script>
        $(document).ready(function() {
            checkPreAuth();
        });
        </script>
    </body>
</html>

4 个答案:

答案 0 :(得分:2)

PhoneGap要求您在根目录的“config.xml”文件中手动设置/允许应用程序的各个方面。

我相信您正在寻找的解决方案就是这条线:

<access origin="http://code.jquery.com" subdomains="true" />

您允许访问“http://code.jquery.com”的外部资源并允许其所有子域。这意味着您刚刚解锁了jquery mobile,这就是您的目标,如脚本标记所示:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
     

这些“src”属性现在被视为http://code.jquery.com的“子域名”,您刚刚成功获得了这些属性!

答案 1 :(得分:1)

你不能在jQuery Mobile下面使用

$(document).ready(function() {
    checkPreAuth();
});

您需要使用自定义jQuery Mobile特定事件。您可能需要更改以下代码。

$('#page').live('pageshow', function(event){
    checkPreAuth();             
});

检查more relevant events的文档。

从你的代码我可以注意到你使用的是jQuery和jQuery Mobile的非常旧的库。我建议您升级到最新的library,这样您就可以使用比当前版本更多的功能。

以下是来自jsfiddle的latest framework的示例。

答案 2 :(得分:0)

除了checkPreAuth();未定义之外,我的代码没有任何问题。您还应该尝试更新您的查询和jquery mobile版本。 我建议您下载并包含在 www 项目目录中包含JQuery mobile和Jquery文件(脚本文件)

答案 3 :(得分:-1)

删除$(document).ready(function()并将checkPreAuth();保留在PhoneGap的deviceready事件中。