js不记录某个url链接历史访问,返回时不返回该链接

复制代码
(function(){
    var fnUrlReplace = function (eleLink) {
        if (!eleLink) {
            return;
        }
        var href = eleLink.href;
        if (href && /^#|javasc/.test(href) === false) {
            if (history.replaceState) {
                // 生成新的URL
                history.replaceState(null, document.title, href.split('#')[0] + '#');
                location.replace('');       // 刷新当前页面URL
            } else {
                location.replace(href);     // 不生成新的历史记录
            }
        }
    };

    document.getElementsByTagName('a')[0].onclick = function (event) {
        // 阻止跳转
        if (event && event.preventDefault) {
            event.preventDefault();     
        }
        fnUrlReplace(this);
        return false;
    };
}());
复制代码

上述场景:在实际工作中,我们会遇到一个页面中有几个tab切换标签,tab切换是修改了浏览器地址”,tab切换是默认记录到历史的。因此我们点击返回按钮的时候,不停的在几个tab中切换,但是,实际我们是想返回到上一页的,不是在几个tab中切换。那么这种情况如何解决呢?

 

如果直接不记录要跳转的url:

复制代码
/**
 * 不记录该url历史记录
 * @param url
 */
var fnUrlReplace = function (url) {
    if (!url) {
        return;
    }
    if (history.replaceState) {
        history.replaceState(null, document.title, url);
        location.replace('');
    } else {
        location.replace(url);
    }
};
复制代码
$('.switch').on('change', function () {
    let _this = $(this);
    let url = 'http://xxx.xxx.xxx?xxx';
    fnUrlReplace(url);
    window.location.href = url;
});

 

 

参考: http://www.zhangxinxu.com/wordpress/2017/02/page-link-url-history-null-not-record/

 
posted @   study_php_java_C++  阅读(422)  评论(0编辑  收藏  举报
编辑推荐:
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
阅读排行:
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· DeepSeek 开源周回顾「GitHub 热点速览」
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
点击右上角即可分享
微信分享提示