我想用JavaScript看是否有历史记录，后退按钮在浏览器上是否可用。
当前回答
历史。长度是无用的，因为它不能显示用户是否可以回到历史。 另外，不同的浏览器使用初始值0或1 -这取决于浏览器。
有效的解决方案是使用$(window)。on('beforeunload'事件，但我不确定它会工作，如果页面是通过ajax加载和使用pushState改变窗口历史。
所以我使用了下一个解决方案:
var currentUrl = window.location.href;
window.history.back();
setTimeout(function(){
// if location was not changed in 100 ms, then there is no history back
if(currentUrl === window.location.href){
// redirect to site root
window.location.href = '/';
}
}, 100);
其他回答
这是我的解决方案:
function historyBack() {
console.log('back');
window.history.back() || window.history.go(-1);
if (!window.history.length) window.close();
var currentUrl = window.location.href;
setTimeout(function(){
// if location was not changed in 100 ms, then there is no history back
if(current === window.location.href){
console.log('History back is empty!');
}
}, 100);
}
function historyForward() {
console.log('forward');
window.history.forward() || window.history.go(+1);
var current = window.location.href;
setTimeout(function(){
// if location was not changed in 100 ms, then there is no history forward
if(current === window.location.href){
console.log('History forward is empty!');
}
}, 100);
}
我不确定这是否有效，它完全未经测试，但试试这个:
<script type="text/javascript">
function goBack() {
history.back();
}
if (history.length > 0) { //if there is a history...
document.getElementsByTagName('button')[].onclick="goBack()"; //assign function "goBack()" to all buttons onClick
} else {
die();
}
</script>
在HTML的某处:
<button value="Button1"> //These buttons have no action
<button value="Button2">
编辑:
您还可以研究哪些浏览器支持back函数(我认为它们都支持)，并使用本页中找到并详细描述的标准JavaScript浏览器检测对象。然后你可以有2个不同的页面:一个是兼容后退按钮的“好浏览器”页面，一个是告诉他们更新浏览器的“坏浏览器”页面
检查window.history.length是否等于0。
还有另一种检查方法——检查推荐人。第一页通常会有一个空的引用。
if (document.referrer == "") {
window.close()
} else {
history.back()
}
我使用了一点PHP来实现这个结果。不过有点生锈了。但它应该会起作用。
<?php
function pref(){
return (isset($_SERVER['HTTP_REFERER'])) ? true : '';
}
?>
<html>
<body>
<input type="hidden" id="_pref" value="<?=pref()?>">
<button type="button" id="myButton">GoBack</button>
<!-- Include jquery library -->
<script>
if (!$('#_pref').val()) {
$('#myButton').hide() // or $('#myButton').remove()
}
</script>
</body>
</html>
