Javascript doOnOrientationChange：无法修复加载页面的错误

我用了一个.js以避免移动设备上的横向视图。我编辑了一张白色全屏图像，上面写着“此网站不适合以横向模式查看，请转动您的设备”，每次我将设备从纵向旋转为横向时都会显示该图像。 它可以工作，除非我加载页面并且我已经处于横向模式。关于如何修复它有什么想法吗？谢谢

<script>
(function() {
    'use strict';

    var isMobile = {
        Android: function() {
            return navigator.userAgent.match(/Android/i);
        },
        BlackBerry: function() {
            return navigator.userAgent.match(/BlackBerry/i);
        },
        iOS: function() {
            return navigator.userAgent.match(/iPhone|iPad|iPod/i);
        },
        Opera: function() {
            return navigator.userAgent.match(/Opera Mini/i);
        },
        Windows: function() {
            return navigator.userAgent.match(/IEMobile/i);
        },
        any: function() {
            return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
        }
    };
    if (isMobile.any()) {
        doOnOrientationChange();
        window.addEventListener('resize', doOnOrientationChange, 'false');
    }

    function doOnOrientationChange() {
        var a = document.getElementById('alert');
        var b = document.body;
        var w = b.offsetWidth;
        var h = b.offsetHeight;
        (w / h > 1) ? (a.className = 'show', b.className = 'full-body') : (a.className = 'hide', b.className = '');
    }
})();
</script>

Update :

我尝试将 window.orientation 添加到脚本中，但出现了问题

if (orientation === "landscape-primary") {
    doOnOrientationChange();
    window.addEventListener('resize',doOnOrientationChange,'false');
}

window.onload(doOnOrientationChange());

您需要移动doOnOrientationChange()函数位于另一个函数之外，然后在页面加载时调用它。像这样它应该工作：

<script>
function checkMobile() {
    var isMobile = false;
    if (navigator.userAgent.match(/Android/i)
     || navigator.userAgent.match(/BlackBerry/i)
     || navigator.userAgent.match(/iPhone|iPad|iPod/i)
     || navigator.userAgent.match(/Opera Mini/i)
     || navigator.userAgent.match(/IEMobile/i)) {
            isMobile = true;
        }
    return isMobile;
}
function doOnOrientationChange() {
    var a = document.getElementById('alert');
    var b = document.body;
    var w = b.offsetWidth;
    var h = b.offsetHeight;
    if (checkMobile()) {
        (w / h > 1) ? (a.className = 'show', b.className = 'full-body') : (a.className = 'hide', b.className = '');
    } else {
        a.className = 'hide';
        b.className = '';
    }
}
window.onload = doOnOrientationChange();
window.addEventListener('resize', doOnOrientationChange, 'false');
</script>