黑帽联盟

 找回密码
 会员注册
查看: 1612|回复: 1

[其它] js判断PC端与移动端跳转

[复制链接]

52

主题

2

听众

310

积分

黑帽学员

Rank: 3Rank: 3

  • TA的每日心情
    奋斗
    2019-9-27 16:27
  • 签到天数: 258 天

    [LV.8]以坛为家I

    在网上看到很多这样类似的代码,但是有的很复杂,或者有的没有判断完全,上次经理去见完客户回来讲,使用苹果浏览打开pc端(pc已经做了识别跳转)会自动跳转到移动端的网页去,后来经测试才发现
    document.writeln(" 是否为移动终端: "+browser.versions.mobile+"</br>");  //打印出来 true

    所以在完整版的代码中 第一层if 判断一直是true

    以上的原因是因为,网上流传的判断为:
    mobile: !! u.match(/AppleWebKit.*Mobile.*/) || !! u.match(/AppleWebKit/), //是否为移动终端

    判断不完整才会造成这种原因。

    正确的判断应该为:
    mobile: !! u.match(/AppleWebKit.*Mobile.*/) || !! u.match(/AppleWebKit/) && u.indexOf('QIHU') && u.indexOf('QIHU') > -1 && u.indexOf('Chrome') < 0, //是否为移动终端

    测试程序代码
    1. var browser = {
    2. versions: function() {
    3.   var u = navigator.userAgent;
    4.   return {
    5.    trident: u.indexOf('Trident') > -1,
    6.    presto: u.indexOf('Presto') > -1,
    7.    webKit: u.indexOf('AppleWebKit') > -1,
    8.    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,
    9.    mobile: !! u.match(/AppleWebKit.*Mobile.*/) || !! u.match(/AppleWebKit/) && u.indexOf('QIHU') && u.indexOf('QIHU') > -1 && u.indexOf('Chrome') < 0,
    10.    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
    11.    android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,
    12.    iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1,
    13.    iPad: u.indexOf('iPad') > -1,
    14.    webApp: u.indexOf('Safari') == -1
    15.   }
    16. } (),
    17. language:(navigator.browserLanguage || navigator.language).toLowerCase()
    18. };
    19. document.writeln("语言版本: "+browser.language+"</br>");
    20. document.writeln(" 是否为移动终端: "+browser.versions.mobile+"</br>");
    21. document.writeln(" ios终端: "+browser.versions.ios+"</br>");
    22. document.writeln(" android终端: "+browser.versions.android+"</br>");
    23. document.writeln(" 是否为iPhone: "+browser.versions.iPhone+"</br>");
    24. document.writeln(" 是否iPad: "+browser.versions.iPad+"</br>");
    25. document.writeln(navigator.userAgent+"</br>");
    复制代码
    完整版,运用于项目代码
    1. /*
    2. *
    3. * 判断PC端与WAP端
    4. */
    5. var mobile_bs = {
    6. versions: function() {
    7.   var u = navigator.userAgent;
    8.   return {
    9.    trident: u.indexOf('Trident') > -1, //IE内核
    10.    presto: u.indexOf('Presto') > -1, //opera内核
    11.    webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
    12.    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
    13.    mobile: !! u.match(/AppleWebKit.*Mobile.*/) || !! u.match(/AppleWebKit/) && u.indexOf('QIHU') && u.indexOf('QIHU') > -1 && u.indexOf('Chrome') < 0, //是否为移动终端
    14.    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
    15.    android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
    16.    iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者QQHD浏览器
    17.    iPad: u.indexOf('iPad') > -1,  //是否iPad
    18.    webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部
    19.   }
    20. } ()
    21. };
    22. if (mobile_bs.versions.mobile) {
    23. if (mobile_bs.versions.android || mobile_bs.versions.iPhone || mobile_bs.versions.iPad || mobile_bs.versions.ios) {
    24.   window.location.href = "移动端网址";
    25. }
    26. };
    复制代码
    以上内容我自己转载网络的

    49

    主题

    1

    听众

    248

    积分

    至尊VIP

    Rank: 8Rank: 8

  • TA的每日心情
    奋斗
    2018-7-15 21:02
  • 签到天数: 215 天

    [LV.7]常住居民III

    不错哈,看看
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 会员注册

    发布主题 !fastreply! 收藏帖子 返回列表 搜索
    回顶部