我想用JavaScript看是否有历史记录,后退按钮在浏览器上是否可用。
当前回答
我试图找到一个解决方案,这是我能得到的最好的(但工作很棒,这是我在这里找到的最简单的解决方案)。
在我的情况下,我想回到历史上一个返回按钮,但如果用户打开的第一页是我的应用程序的子页,它会回到主页。
解决方案是,一旦应用程序被加载,我只是做了一个替换历史状态:
history.replaceState( {root: true}, '', window.location.pathname + window.location.hash)
这样,我只需要在返回之前检查history.state.root。如果是真的,我做一个历史代替:
if(history.state && history.state.root)
history.replaceState( {root: true}, '', '/')
else
history.back()
其他回答
这可能会有帮助:
const prev = window.location.pathname;
window.history.back();
setTimeout(() => {
if (prev === window.location.pathname) {
// Do something else ...
}
}, 1000);
注意window.history.length,因为它还包括window.history.forward()的条目。
window。history。length可能有多于1个条目,但没有历史回溯条目。 这意味着如果你触发window.history.back()
下面的解决方案将导航回来,并告诉是否发生了导航:
async function goBack() {
return new Promise((resolve, reject) => {
const timer = setTimeout(() => reject('nowhere to go'), 100);
window.history.back();
const onBack = () => {
window.removeEventListener('beforeunload', onBack);
window.removeEventListener('popstate', onBack);
clearTimeout(timer);
resolve(true);
};
window.addEventListener('beforeunload', onBack);
window.addEventListener('popstate', onBack);
});
}
// usage
await goBack().catch(err => console.log('failed'));
工作原理:
试着导航回去 添加事件监听器,在导航到另一个网站或同一网站上的另一个页面时触发(SPA网站等) 如果上述事件在100毫秒内没有发生,就可以推断出没有地方可以回去
注意goBack()是一个异步函数。
我的代码让浏览器返回一个页面,如果失败,它加载一个回退url。它还可以检测标签的变化。
当后退按钮不可用时,回退url将在500毫秒后加载,这样浏览器就有足够的时间加载上一页。在window.history.go(-1)之后加载回退url;会导致浏览器使用回退url,因为js脚本还没有停止。
function historyBackWFallback(fallbackUrl) {
fallbackUrl = fallbackUrl || '/';
var prevPage = window.location.href;
window.history.go(-1);
setTimeout(function(){
if (window.location.href == prevPage) {
window.location.href = fallbackUrl;
}
}, 500);
}
浏览器有后退和前进按钮。我想出了这个问题的解决办法。但它会影响浏览器的转发操作,并导致一些浏览器的错误。
它的工作原理是这样的:如果浏览器打开一个从未打开过的新url,历史。长度会变长。
你可以改变哈希值
location.href = '#__transfer__' + new Date().getTime()
要得到一个从未显示的url,然后历史。长度会得到真正的长度。
var realHistoryLength = history.length - 1
但是,它并不总是工作得很好,我不知道为什么,特别是当url自动跳转很快。