JS---PC端和移动端的无缝切换

时间：2024-02-15 18:33:48

最近帮同事优化网站，出现了移动端页面排版布局混乱问题，特此优化

       function browserRedirect() {
            var sUserAgent = navigator.userAgent.toLowerCase();
            var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
            var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
            var bIsMidp = sUserAgent.match(/midp/i) == "midp";
            var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
            var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
            var bIsAndroid = sUserAgent.match(/android/i) == "android";
            var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
            var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
            if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
                //跳转移动端页面
                console.log("^^^^^^^^^^^^");
            } else {
                //跳转pc端页面
                console.log("************");
            }
        }

核心代码也就是上面那部分，chrom浏览器也可以模拟移动端，不过只能解决80%的样式问题，

如果要求极严，建议使用真机测试或手机模拟器测试

 

相关文章