Question

所以我有一个很好的PhoneGap应用程序（cordova 2.7.0，以及jquery mobile 1.2.0），它在我的Android手机上运行良好。 www文件夹也可以使用Firefox，Chrome（通过wamp），IE 10完美运行，并且它在IE7上很难用但可用。

现在，当我试图让这个应用程序在我的Windows Phone上运行时，我一直陷入一些悲伤的行为。（7.5）这是事情：

我的index.html提示用户提供登录外部Web服务器的凭据。这个html文件包含我的应用程序使用的javascript和css文件的所有引用。然后使用ajax通过内容div加载不同的页面，该jj预先填充了登录表单。

我的index.html正文：

<body>
<!-- Begin Page Connect -->
    <div data-role="page" id="index">
        <div data-role="header" data-position="fixed">
              <h1>Connect to Server</h1>
        </div>

        <div data-role="content" >
        <div data-role="collapsible" data-collapsed="false" data-iconpos="none" data-theme="b" data-content-theme="b" id="col1">
            <h3></h3>
            <form id="formConnect" >
                    <label for="server_url" class="ui-hidden-accessible">Url Server:</label>
                    <input type="text" name="server_url" id="server_url" class="required defaultInvalid url" value="" placeholder="http://" data-theme="a" />

                    <label for="username" class="ui-hidden-accessible">Username:</label>
                    <input type="text" name="username" id="username" class="required" value="" placeholder="username" data-theme="a" />

                    <label for="password" class="ui-hidden-accessible">Password:</label>
                    <input type="password" name="pass" id="password" class="required" value="" placeholder="password" data-theme="a" />

                    <button id="cb" disabled type="submit" data-theme="b">Connect</button>
            </form>
        </div>
        </div>

        <div data-role="footer" data-position="fixed">
            <h4></h4>
        </div>
    </div>
    <!-- End Page Connect -->
</body>

现在，当我点击connect时，会发生客户端 - 服务器身份验证过程：

$.ajax({
    url:server_url,
    type: 'GET',
    data: {page: "login", username: user, password: passhash},
    success: function(data) {
        console.log("LOGIN: SUCCESS");
        $.mobile.changePage("home.html", {transition: "slide"});
    }
});

验证成功结束（控制台日志输出“LOGIN：SUCCESS”），然后发生这条javascript：

$.mobile.changePage("home.html", {transition: "slide"});

这就是我得到不可解决的“错误加载页面”错误，并且主页未加载。

我已阅读this question及其答案，但我在www（包括图片）中的所有文件已在其构建操作中设置为“内容”。

另外，在阅读this article后，我想在我的index.html页面上（在表单后面）尝试使用锚点：

<a href="home.html">link</a>

单击时，相同的“错误加载页面”加速。但是当我添加数据-ajax =“false”时：

<a href="home.html" data-ajax="false">link</a>

然后home.html文件会加载，但显然不会起作用，因为它不包含任何js或css引用等。

另外，我在模拟器和实际Windows Phone（HTC HD7）上尝试了所有

任何人都有关于如何至少DEBUG这个意思错误消息的任何信息？ “加载页面错误”根本不对我说。

Answer 1

至于回答有关如何调试它的问题：

您是否尝试过使用Weinre？这是一个很棒的调试环境。它将允许您访问控制台和当前桌面浏览器提供的所有Web开发工具。

链接：http://people.apache.org/~pmuellr/weinre/docs/latest/

Answer 2

事实证明，使用单独的html文件的changePage在Windows Phone 7上不起作用。（至少在我的项目中）你必须将所有页面放在一个文件中。

所以我只是将我的所有页面内容重新整理到一个html文件中，将每个页面的内容放在其专用div中，并带有 data-role =“page”属性和特定的页面ID，现在 changePage（“＃idOfThePage”）在模拟器和实际设备上都能正常运行。

使用Ajax在changePage上“加载页面时出错”

2 个答案: