0

我在我的程序中包含了一个页面,该页面使用 PhoneGap Cordova 显示来自移动设备的加速器数据。我也在使用 JQuery。我的问题是它没有显示数据。我究竟做错了什么?我对移动 HTML 和 JavaScript 开发非常陌生。

     <!DOCTYPE html> 
    <html>
    <head>
    <meta charset="UTF-8">
    <title>jQuery Mobile Web App</title>
    <link href="jquery-mobile/jquery.mobile.theme-1.0.min.css" rel="stylesheet" type="text/css"/>
    <link href="jquery-mobile/jquery.mobile.structure-1.0.min.css" rel="stylesheet" type="text/css"/>
    <script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
    <script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
    </head> 
    <body> 

    <div data-role="page" id="page">
        <div data-role="header">
            <h1>Page One</h1>
        </div>
        <div data-role="content">   
            <ul data-role="listview">
                <li><a href="#page2">Page Two</a></li>
                <li><a href="#page3">Page Three</a></li>
                <li><a href="#page4">Page Four</a></li>
                <li><a href="#page6">Accelerator Example</a></li>
                <li><a href="#page5">Alert Example</a></li>
            </ul>       
        </div>
        <div data-role="footer">
            <h4>Page Footer</h4>
        </div>
    </div>

     //code from other pages excluded

    <div data-role="page" id="page6">
    <div data-role="header">
        <h1>Accelerator example 2</h1>
    </div>
    <div data-role="content" data-theme="b">
    <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>
    <script type="text/javascript" charset="utf-8">
    document.getElementById("ready").innerHTML = "false";
    // Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova is ready
    //
    function onDeviceReady() {
        document.getElementById("ready").innerHTML = "true";
        navigator.accelerometer.getCurrentAcceleration(onSuccess, onError);
    }

    // onSuccess: Get a snapshot of the current acceleration
    //
    function onSuccess(acceleration) {
        /*alert('Acceleration X: ' + acceleration.x + '\n' +
              'Acceleration Y: ' + acceleration.y + '\n' +
              'Acceleration Z: ' + acceleration.z + '\n' +
              'Timestamp: '      + acceleration.timestamp + '\n');
              document.writeln(
              'Acceleration X: ' + acceleration.x + '\n' +
              'Acceleration Y: ' + acceleration.y + '\n' +
              'Acceleration Z: ' + acceleration.z + '\n' +
              'Timestamp: '      + acceleration.timestamp + '\n');*/
             /* $("ax").html(acceleration.x);
    $("ay").html(acceleration.y);
    $("az").html(acceleration.z);
    */
    document.getElementById("ax").innerHTML = acceleration.x;
    document.getElementById("ay").innerHTML = acceleration.y;
    document.getElementById("az").innerHTML = acceleration.z;
    }

    // onError: Failed to get the acceleration
    //
    function onError() {
        alert('onError!');
    }


    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>getCurrentAcceleration</p>
    <p id="ax"></p>
    <p id="ay"></p>
    <p id="az"></p>
    <p id="ready"></p>
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>



</body>
</html>
4

1 回答 1

3

您的示例有两个正文标签,第二个正文中的内容未显示。

此处提供了带有 jQ​​uery Mobile 和 PhoneGap 的加速度计的工作示例。

如果您的目标是 Android,AppLaud Eclipse 插件AppLaud Cloud中的项目创建向导将为您提供一个完全运行的项目。

于 2012-05-20T17:09:16.087 回答