Android 上 HTML 5 中的设备方向问题答案

【问题标题】：device orientation problem in HTML 5 on AndroidAndroid 上 HTML 5 中的设备方向问题
【发布时间】：2011-08-25 09:50:00
【问题描述】：

我有以下代码来检查 HTML 5 中的设备方向和设备运动处理。我从http://dev.w3.org/geo/api/spec-source-orientation.html 得到这个。我使用 iPhone3G 测试了我的代码，并且运动事件被捕获。我不知道为什么设备方向没有被困住。我相信由于 iPhone3G 没有 Compass 支持，我无法捕获 'compassneedcalibration' 事件。

我在 Android 浏览器中测试了该应用程序。（HTC 野火）。我无法得到任何事件。请分享您为什么我们无法在 Android Mobile 中收到事件？

 window.addEventListener("compassneedscalibration", function(event) {
                  alert('Your compass needs calibrating! Wave your device in a figure-eight motion');
                  event.preventDefault();


     }, true);

    window.addEventListener("deviceorientation", function(event) {
                  // process event.alpha, event.beta and event.gamma
                  alert("deviceorientation");
    }, true);

    window.addEventListener("devicemotion", function(event) {
                  // Process event.acceleration, event.accelerationIncludingGravity,
                  // event.rotationRate and event.interval
                   alert("devicemotion");
    }, true);

更新 1

我在 iPhone 和 iPad 中进行测试时注意到的一件事是，无论设备是否移动，事件都会持续不断地触发。

更新 2

我找到了我在 UPDATE 1 中提出问题的原因。该 API 似乎每秒检测并提供 50 次加速度计数据。

【问题讨论】：

标签： javascript iphone android ipad html

【解决方案1】：

我知道现在这些功能仅在 iOS Safari 浏览器中实现。所以我们不能在 iOS 中捕获这些事件。

来源：http://www.mobilexweb.com/samples/ball.html

【讨论】：

值得注意的是它现在可以在 Android 3.0+ 中使用

【解决方案2】：

尝试在 Android 中监听“resize”事件。如果您使用 jQuery，您的代码可能如下所示：

$(window).bind('resize', function() {
    alert('resize!');
});

【讨论】：

Resize 事件用于在 Window 的大小发生变化时捕获事件。我认为你的答案不正确。
嘿@Krishnan 我知道这看起来很时髦，但Android 浏览器似乎并没有按预期触发orientationchange 事件。绑定到 resize 事件为我解决了这个问题。

【解决方案3】：

在 iOS 上，您需要捕获的事件是“onorientationchange”

【讨论】：