JavaScript方向变化在iPad上与PhoneGap不兼容

Question

JavaScript方向变化在iPad上与PhoneGap不兼容

3

我正在将一个小型HTML/CSS/Javascript驱动的网络杂志，使用优秀的移动框架PhoneGap适配成iPad上的iApp。一切都很好，除了从竖屏模式到横屏模式的方向更改。

我在index.html头部使用以下Javascript代码（竖屏）：

  var isiPad = navigator.userAgent.match(/iPad/i) != null;
  var isiPhone = navigator.userAgent.match(/iPhone/i) != null;

  function updateOrientation() {
   if (isiPad || isiPhone) {
    switch (window.orientation) {
     case 90:
      window.location = "index_landscape.html";
      break;
     case -90:
      window.location = "index_landscape.html";
      break;
    }
   }
  }

使用以下的 body 标签：

<body onorientationchange="updateOrientation();">

如果我将iPad旋转到横向模式，它不会切换到index-landscape.html。

有人知道问题出在哪里吗？在PhoneGap框架内改变方向时，是否可以更改HTML文件？换句话说，我只能使用一个HTML文件（index.html）来开发PhoneGap应用程序，必须使用CSS来处理方向变化吗？

如果我在iPad Safari浏览器中将应用程序视为网站，则方向变化正常工作。

感谢任何帮助！

- axooh

发现在使用PhoneGap的Droid X上，window.orientation对于Android 2.2非常有效。 - Doug Domeny

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- axooh · Accepted Answer

我刚刚找到了另一种解决问题的方法。我使用了body onload函数和phonegap.js中的onDeviceReady函数来检查方向：

以下javascript代码现在可以正常工作：

    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    function onDeviceReady() {
        document.addEventListener("orientationChanged", updateOrientation);
    }

    function updateOrientation(e) {
        switch (e.orientation) {
            case 90:
                window.location = "index_landscape.html";
                break;
            case -90:
                window.location = "index_landscape.html";
                break;
        }
    }

更新：此方法适用于两年前的旧版Phonegap和iOS SDK，但根据一些用户的反馈，现在已经不再适用。