<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>phonegap_device_network_notification01</title> <link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/> <script src="../jquery.js" type="text/javascript"></script> <script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script> <script src="../cordova.js" type="text/javascript"></script> <script type="text/javascript" charset="utf-8"> var watchID = null; document.addEventListener("deviceready", onDeviceReady, false); //deviceready var oldValue = { x: null, y: null, z: null } function onDeviceReady() { startWatch(); } function startWatch() { var options = { frequency: 300 }; watchID = navigator.accelerometer.watchAcceleration(onSuccess, onError, options); } function stopWatch() { if (watchID) { navigator.accelerometer.clearWatch(watchID); watchID = null; } } // 获取加速度信息成功后的回调函数 function onSuccess(newValue) { var changes = {}, bound = 2; if (oldValue.x !== null) { changes.x = Math.abs(oldValue.x-newValue.x); changes.y = Math.abs(oldValue.y-newValue.y); changes.z = Math.abs(oldValue.z-newValue.z); } if ((changes.x > bound && changes.y > bound) || (changes.x > bound && changes.z >bound)|| (changes.y > bound && changes.z >bound)) { alert('检测到手机晃动'); } oldValue = { x: newValue.x, y: newValue.y, z: newValue.z } var element = document.getElementById('accelerometer'); element.innerHTML = 'Acceleration X: ' + newValue.x + '<br />' + 'Acceleration Y: ' + newValue.y + '<br />' + 'Acceleration Z: ' + newValue.z + '<br />' + 'Timestamp: ' + newValue.timestamp + '<br />'; } // 获取加速度信息失败后的回调函数 function onError() { alert('onError!'); } </script> </head> <body> <div data-role="page"> <div data-role="header"> <h1>PhoneGap100实战</h1> </div> <div data-role="content"> <div id="accelerometer">监测加速度信息中...</div> <button onclick="stopWatch();">停止监测加速度信息</button> </div> <div data-role="footer"> <h4> </h4> </div> </div> </body> </html>