Question

我的webapp上有以下代码，仅在横向显示div。它在手机上运行效果很好，但它在iPad上也很棒，我不想要它。有没有办法让这个功能只在手持设备上工作？

$(function(){
window.onload = handleOrientation;
    window.addEventListener('orientationchange', handleOrientation, false);
        function handleOrientation() {
            if (window.orientation == "90" || window.orientation == "-90") {
            document.getElementById("landscape").style.display = 'block';
        } else {
            document.getElementById("landscape").style.display = 'none';
        }
    }
});

我是javascript的新手，我能尽快学习和学习，感谢你们，但我不知道该怎么办。

Answer 1

您应该能够区分手机和平板电脑，然后针对平板电脑禁用它。

区分的一种方法是找出屏幕宽度。

if (window.screen.width < 320) {
// This is an iphone
// 320 pixels is the width of an iphone
// do the necessary
}

这可能不是最好的方法，但解决了问题

Answer 2

你需要做一些用户代理嗅探，因为通过检查屏幕尺寸/像素密度几乎不可能分辨出手机和平板电脑。甚至用户代理也不是100％可靠。

您可以在这里找到一些灵感：http://detectmobilebrowsers.com/

Answer 3

如果您只关心iPad作为平板电脑。您可以检查浏览器的用户代理，并仅在其电话时附加监听器。否则，请检查它是否是具有用户代理字符串的移动设备。

if (!navigator.userAgent.test(/iPad/i)) {
    // Attcah listener here
}

检查以下问题的答案，了解如何使用用户代理字符串进行检测。

How do detect Android Tablets in general. Useragent?

window.orientation检测仅适用于手持设备

3 个答案: