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/