专栏首页张戈的专栏js获取url中?后的参数,修复移动版无法切换到电脑版的BUG

js获取url中?后的参数,修复移动版无法切换到电脑版的BUG

昨天,发布了《完美实现移动主题在 360 网站卫士缓存全开情况下的切换》一文,通过 JS 实现了主题在移动端访问时的自动切换,最后提到了可以在电脑版和移动版的 footer 里面加上手动切换链接,实现手动版本切换功能。

今早发现,电脑版切换到移动版是没问题了,但是移动版切换到电脑版,JS 将会再次工作uaredirect.js会再次做 UA 判断,然后由又跳回了电脑版! 也就是说,手机上浏览无法手动切换到电脑版,看来还得继续折腾!

于是,想到一个办法,给移动版的切换链接带上一个参数,再修改 uaredirect.js,当发现链接后面带了指定参数时,就直接 return,而不再进行 UA 判断,避免再次跳转的尴尬。。。

说干就干,在 oschina 找到如下 2 中获取 url 后面参数的方法:

//获取请求url中参数的值:
/*方法一:参数值中没有等于号(“=”)*/
        function getUrlRequest() {
            var url = location.search; //获取url中"?"符后的字串
            var theRequest = new Object();
            if (url.indexOf("?") != -1) {
                var str = url.substr(1);
                if (str.indexOf("&") != -1) {
                    strs = str.split("&");
                    for (var i = 0; i < strs.length; i++) {
                        theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
                    }
                } else {
                    theRequest[str.split("=")[0]] = unescape(str.split("=")[1]);
                }
            }
            return theRequest;
        }
/*方法二:参数值中有等于号的情况(“=”)*/
        function getUrlRequest(){
                var url = location.search; //获取url中"?"符后的字串
                var theRequest = new Object();
                if (url.indexOf("?") != -1) {
                    var str = url.substr(1);
                    if (str.indexOf("&") != -1) {
                        strs = str.split("&");
                        for (var i = 0; i < strs.length; i++) {
                            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
                        }
                    } else {
                        var key = str.substring(0,str.indexOf("="));
                        var value = str.substr(str.indexOf("=")+1);
                        theRequest[key] = decodeURI(value);
                    }
                }
                return theRequest;
        }

根据个人喜好,张戈选择了第二种,然后如下修改uaredirect.js

//获取url后面参数
function getUrlRequest(){
                 var url = location.search;
                 var theRequest = new Object();
                 if (url.indexOf("?") != -1) {
                     var str = url.substr(1);
                     if (str.indexOf("&") != -1) {
                         strs = str.split("&");
                         for (var i = 0; i < strs.length; i++) {
                             theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
                         }
                     } else {
                         var key = str.substring(0,str.indexOf("="));
                         var value = str.substr(str.indexOf("=")+1);
                         theRequest[key] = decodeURI(value);
                     }
                 }
                 return theRequest;
         }
function uaredirect(f) {
     var canshu=getUrlRequest();
    try {
        if (canshu["type"] == "pc") { //当检测到url后面带了type=pc参数时,停止执行.
            return
        }
        var b = false;
        if (arguments[1]) {
            var e = window.location.host;
            var a = window.location.href;
            if (isSubdomain(arguments[1], e) == 1) {
                f = f + "/#m/" + a;
                b = true
            } else {
                if (isSubdomain(arguments[1], e) == 2) {
                    f = f + "/#m/" + a;
                    b = true
                } else {
                    f = a;
                    b = false
                }
            }
        } else {
            b = true
        }
        if (b) {
            var c = window.location.hash;
            if (!c.match("fromapp")) {
                if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i))) {
                    location.replace(f)
                }
            }
        }
    } catch(d) {}
}
function isSubdomain(c, d) {
    this.getdomain = function(f) {
        var e = f.indexOf("://");
        if (e > 0) {
            var h = f.substr(e + 3)
        } else {
            var h = f
        }
        var g = /^www\./;
        if (g.test(h)) {
            h = h.substr(4)
        }
        return h
    };
    if (c == d) {
        return 1
    } else {
        var c = this.getdomain(c);
        var b = this.getdomain(d);
        if (c == b) {
            return 1
        } else {
            c = c.replace(".", "\\.");
            var a = new RegExp("\\." + c + "$");
            if (b.match(a)) {
                return 2
            } else {
                return 0
            }
        }
    }
};​

最后,在移动版主题的 footer 里面加上如下代码:

<!--登陆-->
<a title="登陆" href="http://zhangge.net/wp-login.php">登陆</a>&nbsp;
<!--首页底部切换链接-->
<?php wp_reset_query();if ( is_home()){ ?>
<a title="电脑版" href="http://zhangge.net?type=pc">电脑版</a>
<?php } ?>
<!--文章底部切换链接-->
<?php wp_reset_query();if ( is_single()){ ?>
<a title="电脑版" href="http://zhangge.net/<?php the_ID(); ?>.html?type=pc">电脑版</a>
<?php } ?>
<!--分类页底部切换链接-->
<?php wp_reset_query();if ( is_category()){ ?>
<a title="电脑版" href="http://zhangge.net/<?php echo the_category_slug(); ?>?type=pc">电脑版</a>
<?php } ?>
<!--页面底部切换链接-->
<?php if ( is_page()){ ?>
<a title="电脑版" href="http://zhangge.net/<?php echo the_slug(); ?>?type=pc">电脑版</a>

Ps:代码中加入登陆链接的原因,是因为WordPress Mobile Pack插件会强制转换后台样式,很不和谐!所以改成了登陆到 PC 版后台的链接,若手机主题已存在登陆链接的,删除替换即可。

最终,解决了移动版无法切换到电脑版的 BUG~!

最新补充:突然发现了uaredirect.js中其实已经自带了中断机制:#fromapp 

所以,只要在切换链接后面加上 #fromapp 就可以避免 js 跳转到移动版了!

冏。。。那上面的内容都是白忙活了,仅供参考,仅供参考。。。。

如果,你想换成其他中断参数,可以修改百度提供的uaredirect.js,将代码中的 fromapp 改成你要的标识即可,比如张戈就修改成了 pc,所以在手机上只要访问 http://zhangge.net#pc 就可以正常切换到电脑版了!

那么,文章最后那一大段 footer 代码,也可以将里面的?type=pc改成自定义的中断参数了,比如 #pc,自己看着办~

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 解决JS操作Cookies出现的乱码问题,修复WordPress评论乱码

    为了解决博客纯静态之后无法记住用户信息的问题,我将这个功能改成 JS 操作 Cookie 的方式,将用户信息直接保存到用户本地 cookies 当中,从而脱离 ...

    张戈
  • 网站集成打字震动特效JS代码改进版

    这又是一个拖欠了很久的分享,很早就有朋友留言问评论打字炫彩、震动特效怎么实现的。这功能其实网上早就有人分享 N 遍了,有点搜索技巧和 DIY 能力的站长同学也早...

    张戈
  • Haproxy安装部署文档及多配置文件管理方案

    最近我在负责一个统一接入层的建设项目,涉及到 Haproxy 和 ospf 的运维部署,本文分享一下我在部署 Haproxy 之后整理的运维部署规范,并实现了H...

    张戈
  • let var不同的小感悟

    var 在一个函数里定义 也在这个函数的if语句块里定义的话 ,对这个函数的整个区域来说 这个变量是同一个变量, let 则更细分到像if这样的代码块中 。

    lilugirl
  • Spring Ioc源码分析 之 Bean的加载(五):实例化Bean

    在doCreateBean()代码 <2> 处,有一行代码instanceWrapper = createBeanInstance(beanName, mbd,...

    大王叫下
  • 数据结构——AVL树(C语言)

    AVL(Adelson-Velskii 和 Landis)树是带有平衡条件的二叉查找树。在计算机科学中,AVL树是最先发明的自平衡二叉查找树。在AVL树中任何节...

    Originalee
  • 数据结构——AVL树(C语言)

    AVL(Adelson-Velskii 和 Landis)树是带有平衡条件的二叉查找树。在计算机科学中,AVL树是最先发明的自平衡二叉查找树。在AVL树中任何节...

    Originalee
  • 简单的 PHP木马代码及使用教程

    把上面代码弄到你要搞的网站任意PHP文件内 打开 https://tool.sirblog.cn/iu/webs

    Inkedus
  • MyBatis <set>标签的使用

    MyBatis在生成update语句时若使用if标签,如果前面的if没有执行,则可能导致有多余逗号的错误。 使用set标签可以将动态的配置SET 关键字,和剔...

    唐怀瑟
  • Princeton Algorithms, Boggle

    提供了 BogleBoard 类和 BoggleGame 类,可以很方便把自己写的 Solver 给整合进去,直接编译成可以玩的游戏,顺便也验证一下结果是否正确...

    凝神长老

扫码关注云+社区

领取腾讯云代金券