Mobile Safari 不会触发“orientationchange”——如何调试？

Posted 2023-02-23

【中文标题】Mobile Safari 不会触发“orientationchange”——如何调试？

【英文标题】：Mobile Safari doesn't trigger "orientationchange"—how to debug?

【发布时间】：2016-09-12 19:04:45

【问题描述】：

我有一个网站 (http://7db.9ed.myftpupload.com/)，我想展示针对方向量身定制的内容。在横向模式下，它应该显示一个宽的幻灯片，在纵向它应该切换到一个薄的幻灯片。

我正在尝试使用 Apple 在 Safari Web 内容指南中指定的“orientationchange”事件。

jQuery( document ).ready( function() window.addEventListener("orientationchange", function() console.log("the orientation of the device is now " + screen.orientation.angle); placeSlideshow(); , false); );

这在 Chrome 的 ios 模拟器中运行顺利。但是，在 OSX 硬件模拟器和实时 iOS 设备上，方向更改都不会发生任何事情。这不是placeSlideshow 函数——Safari 根本不会触发方向更改。

无法解决这个问题——我从哪里开始？

【参考方案1】：

原来问题实际上是我添加的 console.log 调用。Safari 无法识别属性 screen.orientation.angle, 并且由于我不知道的原因，这个调用成功地破坏了整个回调。

我删除了日志调用，一切正常。

【讨论】：

至少在 iOS 12.4.4 上，在 iPhone 6 上，没有定义 screen.orientation 对象。它是在 Windows 上的 Chrome 开发工具中定义的，当您单击更改方向按钮时，而不是在实际的 iPhone 上。这就是您的控制台日志调用失败的原因。