2012-05-19 2 views
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> 
+2

Я знаю, что это может показаться грубым, но: есть ли у этого устройства акселерометр? – rcdmk

+0

Да, я уверен, что у него есть один, но спасибо за то, что вы спрашиваете –

ответ

3

В вашем примере есть два тега тела, а содержимое со второго корпуса не показано.

Рабочий пример акселерометра с jQuery Mobile и PhoneGap доступен here.

Если вы настроили таргетинг на Android, мастер создания проекта в AppLaud Eclipse plugin или AppLaud Cloud предоставит вам полностью запущенный проект.

+0

Я использую Dreamweaver CS6 для переноса рабочего примера на свой телефон. Две теги тела? Я подумал, что с JQuery Mobile я должен был поместить все мои страницы в один и тот же html-документ. Также спасибо за пример. –

Смежные вопросы