我想在我的网站内页中放置一个“返回”链接。我可以简单地使用的代码是:
<script>document.write('<a href="#" onClick="history.go(-1); return:false;"></a>')</script>
但是当有人将鼠标悬停在上一页上时,它不会显示上一页的网址,如果没有上一页(例如在新标签中打开链接时),它也将不起作用。所以我需要一个代码,它只在有上一页时出现并且还显示 url。如果有人知道一个好方法,我很感激..
我想在我的网站内页中放置一个“返回”链接。我可以简单地使用的代码是:
<script>document.write('<a href="#" onClick="history.go(-1); return:false;"></a>')</script>
但是当有人将鼠标悬停在上一页上时,它不会显示上一页的网址,如果没有上一页(例如在新标签中打开链接时),它也将不起作用。所以我需要一个代码,它只在有上一页时出现并且还显示 url。如果有人知道一个好方法,我很感激..
document.referrer
是我的建议。
制作一个隐藏的 div 并将链接放置在该 div 中。
<div id="NavBack">//hide it
<a>link here</a>
</div>
在文档加载时,检查是否存在“上一个 URL”之类的内容。如果确实如此,则显示#NavBack,它具有可以向后导航或隐藏的链接。参考这个
我已经用代码补丁更新了答案,给你提示。
<div id="NavBack" style="display:none;">
<a id='test'>link here</a>
</div>
<script type="text/javascript">
if(document.referrer!=''){
var a = document.getElementById("test");
a.href=document.referrer;
document.getElementById("NavBack").style.display='block';
}
</script>
我已经使用了上面的代码,并且效果很好。不过,让我明确一点,这不是标准方式,这只是为了给你我想告诉你的想法。请使用 jquery 而不是 javascript,并且不要在您的项目中提供内联 CSS。
您必须使用 . 检查是否有历史记录条目window.history.length
。如果它大于零,则插入链接。
也可以看看:
https://developer.mozilla.org/en-US/docs/DOM/window.history
https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history
您可以使用history
MDN 中描述的对象
var h = window.history;
hSize = h.length; // is there any history
h.back();
还要检查浏览器对这些方法的支持。