zoukankan      html  css  js  c++  java
  • HTML 点击返回按钮返回上一页,没有上一页转到首页

    大家都知道用JS实现返回上一页的功能很简单,也有几种方法,比如以下:

    点击function,下面两种都可以

    function back(){
        history.go(-1);
    }
    function back(){
       history.back();
    }

    在a标签中实现:

    <a class="back" href="javascript:history.back();"></a>
    上面三种已经基本上实现了返回上一页的功能,但是有一种情况没有考虑到(我们程序员还是要严谨一点嘛),就是假如该页面是别人分享过来的而不是通过其他页面进入的呢?
    那么点击该按钮将不会有任何反应,因为此时history对象中不存在历史记录,也就是说这是你浏览器窗口打开时浏览的第一个页面。
    为了优化用户体验,这里通常有两种解决方案。
    一种是在打开第一个页面时不显示返回上一页按钮,另一种是点击直接返回到网站首页。
    要实现这两种,需要用到document下的一个属性,referrer。
    referrer属性的作用是保存着链接到当前页面的那个页面的URL。
    通过判断document.referrer是否为空,来判断是否含有历史记录URL。
    不显示返回按钮:
    if(document.referrer){
     $('#newheaderback').css('display','none');
    }
    返回首页:
    $('#newheaderback').click(function() {
          if (document.referrer === '') {
            location.href = '/';
            return;
          }
          history.go(-1);
        });
  • 相关阅读:
    javascript之面向对象学习笔记03
    javascript之面向对象学习笔记02
    javascript之面向对象学习笔记01
    记第一次用Linux搭建LAMP环境
    C#随机数
    Android简单的TXT文件存储
    关于Android的ListView一点使用方法
    Android与C#的socket通讯
    Android调用WebService
    并发编程之进程、线程、同步锁 -1
  • 原文地址:https://www.cnblogs.com/liao123/p/12553389.html
Copyright © 2011-2022 走看看